JavaScript 滚动页面到指定元素位置
2015-07-17 17:42
661 查看
页面评论功能,当评论较多时,有时需要滚动到评论头部。
可以使用scrollTop方法,加上一点延时动画(animate),可访问在线演示,代码大体如下:
by iefreer
可以使用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
相关文章推荐
- javascript避免数字计算精度误差的方法
- JavaScript 匹配浮点数
- JS正则表达式验证数字代码
- JSF页面中的JS取得受管bean的数据(受管bean发送数据到页面)
- with语句性能优化
- 自定义JSTL函数
- html与jsp页面的转换+引入外部jsp(html)文件
- 自己写一个Json解析的模型
- js
- jsp显示优酷视频
- Json转换利器Gson之实例一-简单对象转化和带泛型的List转化
- Javascript核心概述 - 深入了解javascript
- JS代码格式化修改表格的数值的格式
- javascript中window.open()与window.location.href的区别
- Jackson学习对象与JSON互相转化
- style、currentStyle、getComputedStyle区别介绍
- Fastjson序列化map时,保留map的进出栈顺序的方法
- js url参数的获取和设置以及删除
- 关于 CommonJS AMD CMD UMD
- web2.0之JSTL与EL