scrolltop

原生JS和jQuery的offset,client,scroll对比

夙愿已清 提交于 2020-01-06 04:42:15
原生 offsetTop //获取元素距离带有定位父元素的位置(没有则以body) offsetLeft offsetWidth //获取元素自身的大小(宽度和高度) 包括了border 和padding offsetHeight offsetParent //返回带有定位的父盒子 没有则是body //返回的值不带单位 clientTop //返回元素上边框大小 clientLeft //返回元素左边框大小 clientWidth //包括padding不包括border 返回值不带单位 clientHeight //高度 document.documentElement.scrollTop //返回被卷去的高度,不带单位 //可读可写 document.documentElement.scrollLeft document.documentElement.scrollWidth //返回自身实际的宽度(滚动宽度),不含边框,不带单位 document.documentElement.scrollHeight window.pageYOffset //页面被卷去 //可读不可写 window.pageXOffset window.scroll(x, y) //滚动窗口至文档中的特定位置 window.scroll(0, 100) //不加单位 //已废弃被scrollTo替代

Navigation with jQuery smooth scroll causes weird behavior

泄露秘密 提交于 2020-01-05 05:28:16
问题 I have a navigation on my website that is powered by jQuery to smooth-scroll to the target ID, but it is acting very strange (Chrome, Firefox): Sometimes it doesn't actually move to the target ID all the way If you click a second time on the target it scrolls you back up to the header Here is a gif demonstrating this weird behavior on my website. I made a simplistic version of my website so you can test it yourself, where you can experience the same weird behavior. I made it as identical as

Navigation with jQuery smooth scroll causes weird behavior

喜夏-厌秋 提交于 2020-01-05 05:28:05
问题 I have a navigation on my website that is powered by jQuery to smooth-scroll to the target ID, but it is acting very strange (Chrome, Firefox): Sometimes it doesn't actually move to the target ID all the way If you click a second time on the target it scrolls you back up to the header Here is a gif demonstrating this weird behavior on my website. I made a simplistic version of my website so you can test it yourself, where you can experience the same weird behavior. I made it as identical as

JS,Jquery获取各种屏幕的宽度和高度

好久不见. 提交于 2020-01-01 19:23:38
Javascript: 网页可见区域宽: document.body.clientWidth 网页可见区域高: document.body.clientHeight 网页可见区域宽: document.body.offsetWidth (包括边线的宽) 网页可见区域高: document.body.offsetHeight (包括边线的高) 网页正文全文宽: document.body.scrollWidth 网页正文全文高: document.body.scrollHeight 网页被卷去的高: document.body.scrollTop 网页被卷去的左: document.body.scrollLeft 网页正文部分上: window.screenTop 网页正文部分左: window.screenLeft 屏幕分辨率的高: window.screen.height 屏幕分辨率的宽: window.screen.width 屏幕可用工作区高度: window.screen.availHeight 屏幕可用工作区宽度: window.screen.availWidth JQuery: $(document).ready(function(){ alert($(window).height()); //浏览器当前窗口可视区域高度 alert($(document).height

Js中 关于top、clientTop、scrollTop、offsetTop的用法

别说谁变了你拦得住时间么 提交于 2019-12-31 06:53:15
网页可见区域宽: document.body.clientWidth; 网页可见区域高: document.body.clientHeight; 网页可见区域宽: document.body.offsetWidth (包括边线的宽); 网页可见区域高: document.body.offsetHeight (包括边线的宽); 网页正文全文宽: document.body.scrollWidth; 网页正文全文高: document.body.scrollHeight; 网页被卷去的高: document.body.scrollTop; 网页被卷去的左: document.body.scrollLeft; 网页正文部分上: window.screenTop; 网页正文部分左: window.screenLeft; 屏幕分辨率的高: window.screen.height; 屏幕分辨率的宽: window.screen.width; 屏幕可用工作区高度: window.screen.availHeight; 屏幕可用工作区宽度:window.screen.availWidth; 1、offsetLeft 假设 obj 为某个 HTML 控件。 obj.offsetTop 指 obj 距离上方或上层控件的位置,整型,单位像素。 obj.offsetLeft 指 obj

Js中 关于top、clientTop、scrollTop、offsetTop的用法

巧了我就是萌 提交于 2019-12-31 06:52:56
网页可见区域宽: document.body.clientWidth; 网页可见区域高: document.body.clientHeight; 网页可见区域宽: document.body.offsetWidth (包括边线的宽); 网页可见区域高: document.body.offsetHeight (包括边线的宽); 网页正文全文宽: document.body.scrollWidth; 网页正文全文高: document.body.scrollHeight; 网页被卷去的高: document.body.scrollTop; 网页被卷去的左: document.body.scrollLeft; 网页正文部分上: window.screenTop; 网页正文部分左: window.screenLeft; 屏幕分辨率的高: window.screen.height; 屏幕分辨率的宽: window.screen.width; 屏幕可用工作区高度: window.screen.availHeight; 屏幕可用工作区宽度:window.screen.availWidth; 1、offsetLeft 假设 obj 为某个 HTML 控件。 obj.offsetTop 指 obj 距离上方或上层控件的位置,整型,单位像素。 obj.offsetLeft 指 obj

Js中 关于top、clientTop、scrollTop、offsetTop的用法

蹲街弑〆低调 提交于 2019-12-31 06:52:43
转自 : http://hi.baidu.com/taomin15201212/item/7b7d0f140d61af0f8ebde433 网页可见区域宽: document.body.clientWidth; 网页可见区域高: document.body.clientHeight; 网页可见区域宽: document.body.offsetWidth (包括边线的宽); 网页可见区域高: document.body.offsetHeight (包括边线的宽); 网页正文全文宽: document.body.scrollWidth; 网页正文全文高: document.body.scrollHeight; 网页被卷去的高: document.body.scrollTop; 网页被卷去的左: document.body.scrollLeft; 网页正文部分上: window.screenTop; 网页正文部分左: window.screenLeft; 屏幕分辨率的高: window.screen.height; 屏幕分辨率的宽: window.screen.width; 屏幕可用工作区高度: window.screen.availHeight; 屏幕可用工作区宽度:window.screen.availWidth; 1、offsetLeft 假设 obj 为某个 HTML 控件。

Js中 关于top、clientTop、scrollTop、offsetTop的用法

戏子无情 提交于 2019-12-31 06:52:27
Js 中 关于 top 、 clientTop 、 scrollTop 、 offsetTop 的用法 网页可见区域宽: document.body.clientWidth; 网页可见区域高: document.body.clientHeight; 网页可见区域宽: document.body.offsetWidth ( 包括边线的宽 ); 网页可见区域高: document.body.offsetHeight ( 包括边线的宽 ); 网页正文全文宽: document.body.scrollWidth; 网页正文全文高: document.body.scrollHeight; 网页被卷去的高: document.body.scrollTop; 网页被卷去的左: document.body.scrollLeft; 网页正文部分上: window.screenTop; 网页正文部分左: window.screenLeft; 屏幕分辨率的高: window.screen.height; 屏幕分辨率的宽: window.screen.width; 屏幕可用工作区高度: window.screen.availHeight; 屏幕可用工作区宽度: window.screen.availWidth; 1 、 offsetLeft 假设 obj 为某个 HTML 控件。 obj

html中offsetTop、clientTop、scrollTop、offsetTop各属性介绍

匆匆过客 提交于 2019-12-31 03:17:51
HTML精确定位:scrollLeft,scrollWidth,clientWidth,offsetWidth scrollHeight: 获取对象的滚动高度。 scrollLeft:设置或获取位于对象左边界和窗口中目前可见内容的最左端之间的距离 scrollTop:设置或获取位于对象最顶端和窗口中可见内容的最顶端之间的距离 scrollWidth:获取对象的滚动宽度 offsetHeight:获取对象相对于版面或由父坐标 offsetParent 属性指定的父坐标的高度 offsetLeft:获取对象相对于版面或由 offsetParent 属性指定的父坐标的计算左侧位置 offsetTop:获取对象相对于版面或由 offsetTop 属性指定的父坐标的计算顶端位置 event.clientX 相对文档的水平座标 event.clientY 相对文档的垂直座标 event.offsetX 相对容器的水平坐标 event.offsetY 相对容器的垂直坐标 document.documentElement.scrollTop 垂直方向滚动的值 event.clientX+document.documentElement.scrollTop 相对文档的水平座标+垂直方向滚动的量 这里是 JavaScript 中建造迁移转变代码的常用属性 页可见区域宽: document.body

html中offsetTop、clientTop、scrollTop、offsetTop各属性介绍

删除回忆录丶 提交于 2019-12-31 03:17:39
HTML精确定位:scrollLeft,scrollWidth,clientWidth,offsetWidth scrollHeight: 获取对象的滚动高度。 scrollLeft:设置或获取位于对象左边界和窗口中目前可见内容的最左端之间的距离 scrollTop:设置或获取位于对象最顶端和窗口中可见内容的最顶端之间的距离 scrollWidth:获取对象的滚动宽度 offsetHeight:获取对象相对于版面或由父坐标 offsetParent 属性指定的父坐标的高度 offsetLeft:获取对象相对于版面或由 offsetParent 属性指定的父坐标的计算左侧位置 offsetTop:获取对象相对于版面或由 offsetTop 属性指定的父坐标的计算顶端位置 event.clientX 相对文档的水平座标 event.clientY 相对文档的垂直座标 event.offsetX 相对容器的水平坐标 event.offsetY 相对容器的垂直坐标 document.documentElement.scrollTop 垂直方向滚动的值 event.clientX+document.documentElement.scrollTop 相对文档的水平座标+垂直方向滚动的量 这里是 JavaScript 中建造迁移转变代码的常用属性 页可见区域宽: document.body