IT博客汇
  • 首页
  • 精华
  • 技术
  • 设计
  • 资讯
  • 扯淡
  • 权利声明
  • 登录 注册

    [原]JavaScript 滚动页面到指定元素位置

    iefreer发表于 2015-07-17 17:42:09
    love 0

    页面评论功能,当评论较多时,有时需要滚动到评论头部。

    可以使用scrollTop方法,加上一点延时动画(animate),可访问在线演示,代码大体如下:

    <html>
        <script src="//wow.techbrood.com/libs/jquery/jquery.min.js"></script>
        <script>
            $(document).ready(function (){
                $("#scroll").click(function (){
                    $('html, body').animate({
                        scrollTop: $("#div1").offset().top
                    }, 2000);
                });
            });
        </script>
    	<ul id="commentlist">
    		<li style="text-align: left">
    		    <img src="" alt="">
    		    <p class="name">iefreer</p>
    		    <span class="time">2015-07-17 16:38:45</span>
    		    <p class="comment_content">comment1</p>
    		</li>
    		<li style="text-align: left">
    		    <img src="" alt="">
    		    <p class="name">iefreer</p>
    		    <span class="time">2015-07-17 16:38:25</span>
    		    <p class="comment_content">comment2</p>
    		</li>
    		<li style="text-align: left">
    		    <img src="" alt="">
    		    <p class="name">iefreer</p>
    		    <span class="time">2015-07-17 16:38:02</span>
    		    <p class="comment_content">comment3</p>
    		</li>
    	</ul>
    	<button id="scroll">Scroll me</button>
    </html>

    by iefreer




沪ICP备19023445号-2号
友情链接