关于window.pageYOffset和document.documentElement.scrollTop
举个例子:
Css:假定进行如下简单设置;
html{height:1000px;}
JS:
代码如下:
function(){
window.scrollBy(0,100);
alert(window.pageYOffset);
}
Results:
//点击一次后弹出:100;得出的是一个数值,read-only属性;value:Integer(整数),default:0;
附注:当滚动条到达页面最底部时,window.pageYOffset=1000-document.documentElement.clientHeight;
相关推荐
-
jQuery 位置函数offset,innerWidth,innerHeight,outerWidth,outerHeight,scrollTop,scrollLeft
复制代码 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" > <head> <title>jQuery的位置
-
top、clientTop、scrollTop、offsetTop
top.clientTop.scrollTop.offsetTop 图示说明如下: 51windows.Net var s = ""; s += "\r\n网页可见区域宽:"+ document.body.clientWidth; s += "\r\n网页可见区域高:"+ document.body.clientHeight; s += "\r\n网页可见区域宽:"+ document.body.offsetWidth +&q
-
js中scrollHeight,scrollWidth,scrollLeft,scrolltop等差别介绍
复制代码 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv=&qu
-
JS中完美兼容各大浏览器的scrolltop方法
1.各浏览器下 scrollTop的差异 IE6/7/8/9/10: 对于没有doctype声明的页面里可以使用 document.body.scrollTop 来获取 scrollTop高度 : 对于有doctype声明的页面则可以使用 document.documentElement.scrollTop : Safari: safari 比较特别,有自己获取scrollTop的函数 : window.pageYOffset : Firefox: 火狐等等相对标准些的浏览器就省心多了,直接
-
jquery scrollTop方法根据滚动像素显示隐藏顶部导航条
本文使用jquery的scrollTop方法监视页面垂直滚动像素,并根据像素隐藏或者显示顶部的导航条. 效果预览网址:http://www.keleyi.com/keleyi/phtml/scrolloversee.htm scrollTop的介绍: 语法 $(selector).scrollTop(offset) 参数 offset 描述 可选.规定相对滚动条顶部的偏移,以像素计. 定义和用法 scrollTop() 方法返回或设置匹配元素的滚动条的垂直位置. scroll top offse
-
jQuery动画效果animate和scrollTop结合使用实例
CSS属性值是逐渐改变的,这样就可以创建动画效果.只有数字值可创建动画(比如 "margin:30px").字符串值无法创建动画(比如 "background-color:red"). 复制代码 代码如下: $('#shang').click(function(){$('html,body').animate({scrollTop: '0px'}, 800);}); 上面的代码表示滚动条跳到0的位置,页面移动速度是800.结合scrollTop实用示例: 复制代码
-
scrollTop 用法说明
下面的演示中,外层元素的高度值是200px,内层元素的高度值是300px.很明显,"外层元素中的内容"高过了"外层元素"本身.当向下拖动滚动条时,有部分内容会隐没在"外层元素的上边界"之外,scrollTop就等于这部分"不可见的内容"的高度. 演示:(拖动滚动条,可以看到scrollTop值的变化) 这些文字显示在内层元素中. scrollTop值是: 这些文字显示在内层元素中. [Ctrl+A 全选 注:如需引入外部Js需
-
js中top、clientTop、scrollTop、offsetTop的区别 文字详细说明版
网页可见区域宽: document.body.clientWidth;网页可见区域高: document.body.clientHeight;网页可见区域宽: document.body.offsetWidth (包括边线的宽);网页可见区域高: document.body.offsetHeight (包括边线的宽);网页正文全文宽: document.body.scrollWidth;网页正文全文高: document.body.scrollHeight;网页被卷去的高: documen
-
javascript scrollTop正解使用方法
javascript scrollTop 获取滚动条相对于其顶部的偏移(如制作自动显示隐藏的"返回顶部"按钮).在实际应用中经常会遇到以下问题:document.documentElement.scrollTop在Chrome里总为0document.body.scrollTop 在IE和firefox里总为0 1.各浏览器下 window.pageYOffset/document.documentElement.scrollTop/document.body.scrollTop的差异
-
关于scrollLeft,scrollTop的浏览器兼容性测试
今天在修改原群组弹窗的时候,发现弹窗在谷歌浏览器chrome下的位置跟在别的浏览器下不一样.逐一排查,肯定是在计算窗口位置的时候,少加了scrollTop这个值.在查看源代码的时候发现直接采用 document.documentElement.scrollTop这个,但在chrome下这个值为0. 在有文档声明的情况下,也就是第一行有个dtd声明,标准浏览器认识document.documentElement.scrollTop,可chrome竟然不认识这斯.在没有文档声明的情况下,chrome
随机推荐
- 使用 powershell 创建虚拟机
- 通过批处理调用SQL的方法(osql)
- Oracle8i和Microsoft SQL Server比较
- 利用Jasmine对Angular进行单元测试的方法详解
- PHP html标签正则替换并可自定义正则规则
- 基于JS实现发送短信验证码后的倒计时功能(无视页面刷新,页面关闭不进行倒计时功能)
- 如何用PHP来实现一个动态Web服务器
- PHP 使用 Imagick 裁切/生成缩略图/添加水印自动检测和处理 GIF
- C# 文件上传下载(Excel导入,多线程下载)功能的实现代码
- Shape对象与VML坐标系
- CSDN 博客的代码高亮问题自己修复
- AJAX FCKEditor Rich Editor整合篇第1/2页
- jQuery实现横向带缓冲的水平运动效果(附demo源码下载)
- Redis教程之代理ip池设计方法详解
- mysql误删root用户或者忘记root密码解决方法
- mysql问题之slow log中出现大量的binlog dump记录的解决方法
- 表单提交前触发函数返回true表单才会提交
- JavaScript获得选中文本内容的方法
- Java编程BigDecimal用法实例分享
- 基于C#实现俄罗斯方块游戏