Window pageXOffset 和 pageYOffset 属性

最新推荐文章于 2024-03-17 23:39:10 发布
最新推荐文章于 2024-03-17 23:39:10 发布
阅读量5.9k 收藏 2
点赞数 3
分类专栏： js 文章标签： javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/liujinahui/article/details/49761693
版权

Window pageXOffset 和 pageYOffset 属性

1. 定义和用法

pageXOffset 设置或返回当前页面相对于窗口显示区左上角的 X 位置。pageYOffset 设置或返回当前页面相对于窗口显示区左上角的 Y 位置。

2. 语法

window.pageXOffset
window.pageYOffset

JavaScript（六）（浏览器模型/window对象/iframe）
qq_43456781的博客
07-27 2186
JavaScript（六）（浏览器模型/window对象） 文章目录JavaScript（六）（浏览器模型/window对象）八、浏览器模型54. 浏览器环境概述54.1 代码嵌入网页的方法54.1.1 script 元素嵌入代码54.1.2 script 元素加载外部脚本54.1.3 事件属性54.1.4 URL 协议54.2 script 元素==54.2.1 网页工作原理==54.2.2 defer 属性54.2.3 async 属性54.2.4 脚本的动态加载54.3 浏览器的组成54.3.1 渲染
前端 —— JavaScript 基础篇 18 -- window.pageYOffset
宁静致远
06-21 5419
最近想仿照淘宝首页的侧边栏，写个简单的小例子。获取滚动条距离顶部的距离用到了window.pageYOffset 方法。 window.pageYOffset 返回文档当前沿垂直轴（即向上或向下）滚动的像素数，其值为0.0，表示该Document的顶部边缘当前与窗口内容区域的顶部边缘对齐。pageYOffset是scrollY的一个别名是 window的只读属性 在IE9及以上、谷歌 、Safari、firefox，Opera(presto内核) 都支持 此语句 window.pageYO...
JS：window对象的pageXOffset、innerWidth、outerWidth、screenLeft、screenX
鬼眼邪神
09-02 5782
window.pageXOffset 获取页面文档向右滚动过的像素数。 window.pageYOffset 获取页面文档向下滚动过的像素数。 浏览器兼容性 IE7、8不支持，可以使用document.documentELement.scrollLeft/scrollTop来代替。 window.innerWidth 设置或获取浏览器窗口文档显示区域的宽度，包括滚动条。 windo
JavaScript | 检测文档在垂直方向已滚动的像素值用pageYOffset在webstorm上显示弃用了，是否应该继续使用？还是用其他替代？
红星编程实验室
03-17 1247
为了跨浏览器兼容，请使用 window.pageYOffset 代替 window.scrollY。另外，旧版本 IE（
元素滚动scroll系列相关属性和pageYOffset
weixin_46682277的博客
04-08 1390
使用scroll系列相关属性可以动态获取该元素的大小、滚动距离等。 scroll系列属性 作用 element.scrollTop 返回被滚动上去的上侧距离，不带单位 element.scrollLeft 返回被滚动到左侧的距离，不带单位 element.scrollWidth 返回自身实际的宽度，不含边框，不带单位 element.scrollHeight 返回自身实际的高度，不含边框，不带单位 <!-- box盒子的宽和高都是200px --> <div
获取页面长宽和滚动条的位置
01-21
<!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> <script type="text/javascript"> function GetPageSize() { var scrW, scrH; if(window.innerHeight && window.scrollMaxY) { // Mozilla scrW = window.innerWidth + window.scrollMaxX; scrH = window.innerHeight + window.scrollMaxY; } else if(document.body.scrollHeight > document.body.offsetHeight) { // all but IE Mac scrW = document.body.scrollWidth; scrH = document.body.scrollHeight; } else if(document.body) { // IE Mac scrW = document.body.offsetWidth; scrH = document.body.offsetHeight; } var winW, winH; if(window.innerHeight) { // all except IE winW = window.innerWidth; winH = window.innerHeight; } else if (document.documentElement && document.documentElement.clientHeight) { // IE 6 Strict Mode winW = document.documentElement.clientWidth; winH = document.documentElement.clientHeight; } else if (document.body) { // other winW = document.body.clientWidth; winH = document.body.clientHeight; } // for small pages with total size less then the viewport var pageW = (scrW<winW) ? winW : scrW; var pageH = (scrH<winH) ? winH : scrH; return {PageW:pageW, PageH:pageH, WinW:winW, WinH:winH}; } function GetPageScroll() { var x, y; if(window.pageYOffset) { // all except IE y = window.pageYOffset; x = window.pageXOffset; } else if(document.documentElement && document.documentElement.scrollTop) { // IE 6 Strict y = document.documentElement.scrollTop; x = document.documentElement.scrollLeft; } else if(document.body) { // all other IE y = document.body.scrollTop; x = document.body.scrollLeft; } return {X:x, Y:y}; } function main() { var div = document.getElementById("div"); for(var i=0; i<200; i++) { document.body.appendChild(document.createTextNode("Hello, World!")); document.body.appendChild(document.createElement("br")); } var sz = GetPageSize(); alert([sz.PageW,sz.PageH,sz.WinW,sz.WinH].join(", ")); window.scrollTo(0, 1500); var sl = GetPageScroll(); alert([sl.X,sl.Y].join(", ")); } </script> </head> <body onload="main();"> </body> </html>
获取页面滚动距离pageYOffset、scrollY、scrollTop
qq_43654065的博客
09-23 6048
在获取页面滚动距离的高度时候，往往有不同的获取方式，而且不同的属性浏览器支持稍有差别： pageYOffset：属window对象，IE9+、Firefox、Chrome、Opera均支持该方式获取页面滚动敢赌值，并且会忽略DOCTYPE定义规则。 window.pageYOffset scrollY：属于window对象，Firefox、Chrome、Opera均支持，IE不支持，忽略DOCTYPE定义规则。 window.scrollY 页面如果未定义DOCTYPE文档头，所有浏览器都支持
JavaScript中Window对象的属性及事件
10-23
"pageXOffset"和"pageYOffset"属性分别返回页面水平和垂直滚动的距离，这些属性常用于动态调整页面布局或定位元素。 Window对象的方法则定义了一系列的功能性操作。例如，"alert()"方法用来弹出警告框，"blur()...
属于window对象属性的是
06-12
在JavaScript中，属于`window`对象属性的有许多，以下是一些常用的`...这些`window`对象属性可以用来获取或设置浏览器窗口的大小、位置、滚动条位置、文档信息等等，可以帮助我们实现许多与窗口和文档相关的操作。
【温故而知新】JavaScript的BOM之Window对象.md
最新发布
06-13
### JavaScript的BOM之Window对象 #### 一、概念 BOM（Browser Object Model）即浏览器对象模型，它是JavaScript中的一个...通过熟练掌握Window对象的相关属性和方法，开发者可以实现更加灵活和功能强大的Web应用。
键盘监听事件
weixin_60678589的博客
03-22 496
mounted() { this.keyDown(){ document.onkeydown = (e) => { let e1 = e || event || window.event || arguments.callee.caller.arguments[0] if (e1 && e1.keyCode == 37) { } else if (e1 && e1.ke...
如何用JS禁止弹出警告框
程序人生的专栏
12-04 6437
警告框是很多用户不喜欢的提示。本例学习如何通过重写方法，实现禁止警告框的功能。 【实现代码】         标题页 <!-- window.alert = function(str) { return ; } alert("看看能不能弹出警示框");//--> 【难点剖析】 本例的重点是对于“a
typeScript @types/webpack-env/index.d.ts报错
chaogaoxiaojifantong的博客
12-26 3057
tsconfig.json 设置 "compilerOptions": { "skipLibCheck":true } 忽略所有的声明文件（ *.d.ts）的类型检查
ts编译报错 “platform”已弃用
mytac的博客
12-06 3594
navigator.platform 被废弃了，不推荐再用，详见Navigator.platform 这里用userAgentData.platform代替： NavigatorUAData const userAgentData = navigator.userAgentData; const { platform } = userAgentData;
Sentry前端错误监控 源码小品
qq_28992047的博客
07-04 598
源码摘要
window.pageXOffset /pageYOffset 和 scrollLeft、scrollTop 返回当前页面相对于窗口显示区左上角的坐标位置
weixin_41796631的博客
04-19 2661
用法： 返回网页视区左上角的起始点相对于浏览器的X,Y位置 pageXOffset 设置或返回当前页面相对于窗口显示区左上角的 X 位置。 pageYOffset 设置或返回当前页面相对于窗口显示区左上角的 Y 位置。 语法： window.pageXOffset window.pageYOffset pageXOffset 和 pageYOffset 属性相等于 scrol...
浏览器滚动条位置
weixin_44260504的博客
03-27 1757
浏览器滚动条位置 查看滚动条距离 ie9 以下不兼容： window.pageXOffset / window.pageYOffset ie9以下版本： document.body.scrollLeft / Top； document.documentElement.scrollLeft / Top； 这两个属性在ie9以下的每个版本中都只存在一个，所以处理兼容性问题时把它们相加就可以了。 ...
正确使用pageX、pageY、offsetLeft、offsetTop
zheng_pika的博客
07-05 9599
获取鼠标位置的时候，遇到一点疑问，然后验证了一下自己的疑惑；pageX、pageY跟clientX和clientY类似，是相对于浏览器文档的坐标；offsetLeft、offsetTop获取的是固定定位，也就是说，监听某个选择器内的鼠标位置，这个方法返回的是这个固定范围的左上角离页面左上角的距离坐标；下面利用一个简单的div来演示一下div{ width: 100px; ...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值