개발

[javascript] div 스크롤 자동으로 내리기


div 에 설정한 스크롤이 자동으로 올라가게 하기

 

 

 

먼저 스크롤바를 넣어줄 div 에 style 설정을 해준다.

 

<div id="scrollDiv" style="overflow: auto;"> 
</div>

 

overflow: hidden; /* div 고정된 영역을 벗어나면 보이지 않음. 스크롤 X */
overflow: visible; /* div 고정된 영역을 벗어나도 보여. 스크롤 X */
overflow: scroll; /* div 고정된 영역을 벗어나면 화면 스크롤. */
overflow-x: scroll; /* div 고정된 영역을 벗어나면 x축으로만 스크롤. */
overflow-y: scroll; /* div 고정된 영역을 벗어나면 y축으로만 스크롤. */
overflow: auto; /* div 영역의 값에 따라 자동 스크롤. */

 

 

스크롤바 설정

 

javascript

 

<script>

var divdiv = document.getElementById("scrollDiv");

divdiv.scrollTop = divdiv.scrollHeight;

</script>

<body>

<div id="scrollDiv" style="overflow:auto" ></div>

</body>

 

 

jquery

 

<script>

$('#scrollDiv').scrollTop($('#scrollDiv').prop('scrollHeight'));

</script>

<body>

<div id="scrollDiv" style="overflow:auto" ></div>

</body>

 

 

 

 

jquery scroll 속성

 

$('#scrollDiv').prop('scrollWidth'));

$('#scrollDiv').prop('clientWidth'));

$('#scrollDiv').prop('offsetWidth'));

$('#scrollDiv').prop('scrollHeight'));

$('#scrollDiv').prop('clientHeight'));

$('#scrollDiv').prop('offsetHeight'));

'개발' 카테고리의 다른 글

[javascript] JSON 파싱  (0) 2014.10.23
CentOS 시간설정 TimeZone 설정  (0) 2014.10.23
jQuery style.display 변경 함수  (0) 2014.10.23
[알고리즘] Fisher–Yates Shuffle  (0) 2014.08.23
국내 IPv4주소 목록(2014.08.23 현재)  (0) 2014.08.23

,