zoukankan html css js c++ java

jQuery元素滚动安静点

元素滚动

1. scrollTop():

读取/设置滚动条的Y坐标

2. $(document.body).scrollTop()+$(document.documentElement).scrollTop()

读取页面滚动条的Y坐标(兼容chrome和IE)

3. $('body,html').scrollTop(60);

滚动到指定位置(兼容chrome和IE)

<!DOCTYPE html>
<html>

<head>
  <meta charset="UTF-8">
  <title>13_元素滚动</title>
</head>
<body style="height: 2000px;">
<div style="border:1px solid black;100px;height:150px;overflow:auto">
  This is some text. This is some text. This is some text. This is some text.
  This is some text. This is some text. This is some text. This is some text.
  This is some text. This is some text. This is some text. This is some text.
  This is some text. This is some text. This is some text. This is some text.
  This is some text. This is some text. This is some text. This is some text.
  This is some text. This is some text. This is some text. This is some text.
  his is some text.
</div>
<br>
<br>
<br>
<button id="btn1">得到scrollTop</button>
<button id="btn2">设置scrollTop</button>

<!--
1. scrollTop():
  读取/设置滚动条的Y坐标
2. $(document.body).scrollTop()+$(document.documentElement).scrollTop()
  读取页面滚动条的Y坐标(兼容chrome和IE)
3. $('body,html').scrollTop(60);
  滚动到指定位置(兼容chrome和IE)
-->
<script src="js/jquery-1.10.1.js"></script>
<script>
  /*
   需求:
   1. 得到div或页面滚动条的坐标
   2. 让div或页面的滚动条滚动到指定位置
   */
  //1. 得到div或页面滚动条的坐标
  $('#btn1').click(function () {
    console.log($('div').scrollTop())
    //下面2种都是兼容了chrome和ie浏览器的写法，因为
    console.log($('html').scrollTop()+$('body').scrollTop())
    //原生js写法
    console.log($(document.documentElement).scrollTop()+$(document.body).scrollTop())  
  })
  //2. 让div或页面的滚动条滚动到指定位置
  $('#btn2').click(function () {
    $('div').scrollTop(200)
    //并集的写法，用逗号隔开，设置y轴离顶部300px，
    $('html,body').scrollTop(300)
  })
</script>
</body>

</html>

界面：

查看全文

相关阅读:
未来开发构想：
3种方式遍历repeater中的CheckBox全选
 [常见面试题]一条Sql语句：取出表A中第31到第40记录,ID可能不是连续的
 mpc源代码下载，编译，调试
 哈希表(Hashtable)使用
 ASP.NET常用代码
 [转]Erwin4.1.4与PowerDesign9.5
Three things everyone should know to improve object retrieval
Learning the parts of objects by nonnegative matrix factorization (Letters to Nature)
js 钟表

原文地址：https://www.cnblogs.com/anjingdian/p/15564110.html

jQuery元素滚动 安静点

jQuery元素滚动安静点