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

能够使用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 滚动页面到指定元素位置的更多相关文章

  1. selenium（6）-截取完整页面和指定元素并保存为图片

    截图操作 截取整个页面 截取指定元素 只有这2个方法 比较简单,见下图代码 from selenium import webdriver driver = webdriver.Chrome(" ...

  2. jquery操作滚动条滚动到指定元素位置 scrollTop

    $('.brand_t a').bind('click',function(){ if($(this).attr('title1')){ var toChar = $(this).attr('titl ...

  3. Vue系列：滚动页面到指定位置实现

    方法1:scrollTop 滚动到某位置 方法2:scrollTo,scrollBy,scroll滚动到某位置 方法3:scrollIntoView() 实现滚动到具体某元素 需注意,上述3种方法都不 ...

  4. 利用 Python + Selenium 实现对页面的指定元素截图(可截长图元素)

    对WebElement截图 WebDriver.Chrome自带的方法只能对当前窗口截屏,且不能指定特定元素.若是需要截取特定元素或是窗口超过了一屏,就只能另辟蹊径了. WebDriver.Phant ...

  5. 在浏览器中使用jquery取得iframe中页面中指定元素的值的不同

    自己使用aspx页面中嵌套了ascx的页面其中使用了iframe的一些内容,出现了同一个页面的两种取值的方式 1. 在iframe的包含页面,需要使用iframe的页面中的元素,是需要使用$(wind ...

  6. Python + Selenium 实现对页面的指定元素截图(可截长图元素)【转载】

    先在首页上执行一段 JavaScript 脚本,将页面的滚动条拖到最下方,然后再拖回顶部,最后才截图.这样可以解决那种按需加载图片的情况 以下代码为转载别处博客改造后的,有chrome和ff两种浏览器 ...

  7. 自动网页截图并指定元素位置裁剪图片并保存到excel表格

    # coding=utf-8 import os import time from selenium import webdriver from selenium.webdriver.chrome.o ...

  8. javascript 生成页面轮播元素

    <html xmlns="http://www.w3.org/1999/xhtml"><head runat="server">    ...

  9. xamarin.forms 绑定页面里指定元素的某个属性值

    {Binding Source={x:Reference elementName}, Path=BindingContext.propertyname, Mode=OneWay} elementNam ...

随机推荐

  1. macos10.8.5原版系统dmg转iso

    网上非常多资料说使用UltraISO打开macos10.8.5, 将InstallESD.dmg提取出来, 然后再用UltraISO打开InstallESD.dmg,点转换格式, 选择iso, 然后用 ...

  2. 详解C++ friend关键字

    1. 为什么要使用友元? 通常对于普通函数来说,要访问类的保护成员是不可能的,如果想这么做那么必须把类的成员都生命成为 public( 共用的) ,然而这做带来的问题遍是任何外部函数都可以毫无约束的访 ...

  3. jdk\willy\集群安装

    一.telnet用户验证端口: yum install telnet #也可以使用 yum install telnet-ssl 安装支持SSL的telnet方式,这样安全一些,不建议使用标准的tel ...

  4. Eclipse的Tomcat热部署，免重启的方法

    背景与目标: 最好使用MyEclipse部署Web应用,在开发调试时,非常方式.资源文件修改可以自动的同步.修改Java文件,除非改变类的结构定义,也可以实现热部署的效果. 后来使用Eclipse J ...

  5. jquery之checkbox

    //checkbox 数据回显 var publishRange=rowData.publishRange.split(","); for(var i = 0;i < pub ...

  6. 前端笔试题目总结——应用JavaScript函数递归打印数组到HTML页面上

    数组如下: var item=[{ name:'Tom', age:70, child:[{ name:'Jerry', age:50, child:[{ name:'William', age:20 ...

  7. EF中使用SqlQuery进行参数化查询时抛出异常

    EF中使用带参数的SqlQuery进行查询时,抛出"另一个 sqlparametercollection 中已包含 sqlparameter"异常. 这是由于SqlParamert ...

  8. Slony-I双机备份

    测试环境:postgresql 9.3.5,slony-I2.2.3(application stack builder提供)以下参考网上教程亲自测试总结 ---------------------- ...

  9. Win7下VS2010使用STLPort 和boost1.56.

    STLport的下载地址 http://sourceforge.net/projects/stlport/ 下载后,解压出文件.我的目录是 D:\STLport-5.2.1 . 右键计算机,属性,高级 ...

  10. cmd编译运行Java文件详解

    ①准备工作 首先用记事本编写HelloWorld.java放至G:\Javaspace路径 public class HelloWorld{ public static void main(Strin ...