336x280(권장), 300x250(권장), 250x250, 200x200 크기의 광고 코드만 넣을 수 있습니다.

<div id="sample" 

          style="overflow:auto; width:100%; height:30px; line-height:150%">

                 스크롤이 되는 div<br>

                 스크롤이 되는 div<br>

                 스크롤이 되는 div<br>

                 스크롤이 되는 div<br>

                 스크롤이 되는 div<br>

                 스크롤이 되는 div<br>

        

</div>


위 코드의 style에서 "overflow" 라는 것이 핵심인데, overflow에 auto 혹은 scroll이라고 주면, scrollbar가 나타나며, scroll이 된다.


스크롤바가 맘에 들지 않는다면, "overflow: hidden" 이라고 주어, scrollbar가 사라지게 한 후, javascript로 원하는 것을 만들어 낼 수 있다.


아래 javascript는 위 또는 아래로 div를 스크롤하는 예제이다.

이것을 응용하면, 이쁘고 훌륭한 scroll div를 만들 수 있을 것이다.


        function doScrollerIE(dir, src, amount) 

        {

                if (amount==null) amount=10;

                if (dir=="up")

                        document.all[src].scrollTop-=amount;

                else

                        document.all[src].scrollTop+=amount;

        }


'IT > html_css' 카테고리의 다른 글

iframe 문제점.  (0) 2015.05.21
placeholder 줄바꿈.  (0) 2015.05.21
다른 도메인 ifame 리사이징.  (0) 2015.05.08
iframe resize, resizing, 리사이징.  (0) 2015.04.27
HTML5 / CSS3 placeholder 폰트 색상 지정  (0) 2015.03.17
Posted by 당양부부34

블로그 이미지
주요 토렌트를 블로깅하고 있습니다. 토렌트 순위 등은 다른 사이트를 찾아보세요. 주요 웹툰 순위도 게재했어요 경제를 좋아하는 일산의 행복한 프로그래머입니다.
당양부부34
Yesterday
Today
Total

달력

 « |  » 2024.4
1 2 3 4 5 6
7 8 9 10 11 12 13
14 15 16 17 18 19 20
21 22 23 24 25 26 27
28 29 30

최근에 올라온 글

최근에 달린 댓글

최근에 받은 트랙백

글 보관함