如何在div标签内向下滚动到底部?

时间:2014-10-04 04:32:09

标签: javascript jquery jsp

<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>   
<script>
jQuery(document).ready(function($) {
    window.scroll(0, document.documentElement.scrollHeight); 
});
</script>
</head>
<body>
    <div id="hahaha">
        <% for (int i = 0 ; i < 100 ; i++ ) {%>
            <div><%=i%></div>
        <% } %>
    </div>
        <% for (int i = 0 ; i < 100 ; i++ ) {%>
        <div><%=i%></div>
    <% } %>
</body>

CSS:

div#hahaha{
    background-color: #EEEEEE;
    position: absolute;
    width:500px;
    height:200px;
    overflow-y: scroll;
}

此代码仅适用于位于浏览器右侧的主滚动条,但不在div标签内工作,任何人都可以告诉我如何使位于div内的内容滚动到底部?

2 个答案:

答案 0 :(得分:0)

使用jQuery你可以这样做:

var bottom= $('div').height()+$('div').prop('scrollHeight');    
$('div').scrollTop(bottom);

或者如果你想为它制作动画:

var bottom= $('div').height()+$('div').prop('scrollHeight');    
$('div').animate({scrollTop:bottom},500);

答案 1 :(得分:0)

以下是您可以使用OffsetPosition查找要滚动到的div的位置的示例

使用offset

JS fiddle

usign position

JS fiddle

$(window).load(function () {
     var pos = $('.scrollhere').position()  // or .offset
     var toppos = pos.top
     $('#scrolling').stop().animate({
         'scrollTop': toppos
     }, 1000)
 })