页面位置

Posted tuhazi

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了页面位置相关的知识,希望对你有一定的参考价值。

//   定位父级offsetParent的定义是:与当前元素最近的经过定位(position不等于static)的父级元素
// 偏移量:offsetTop,offsetHeight,offsetWidth,offsetLeft
// offsetTop表示元素的上外边框至offsetParent元素的上内边框之间的像素距离
// 偏移:offsetWidth = width + padding-left + padding-right + border*2 (如有滚动条 则加上滚动条宽度) 客户端:clientWidth = width + padding-left + padding--right
// clientTop 和 clientLeft 为border的宽度(块级元素) 为行内元素则为0
// E8-浏览器下如果使用currentStyle()方法获取<html>和<body>(甚至普通div元素)的边框宽度都是medium,而如果使用clientLeft(或clientTop)获取边框宽度,则是实际的数值
// scrollHeight表示元素的总高度,包括由于溢出而无法展示在网页的不可见部分
// document.documentElement.clientHeight表示页面的可视区域的尺寸,而document.documentElement.scrollHeight表示html元素内容的实际尺寸。
// 兼容:var docHeight = Math.max(document.documentElement.scrollHeight,document.documentElement.clientHeight);
// var docWidth = Math.max(document.documentElement.scrollWidth,document.documentElement.clientWidth);
// scrollTop属性表示被隐藏在内容区域上方的像素数
// scrollTop的兼容:var docScrollTop = document.documentElement.scrollTop || document.body.scrollTop
// 回到顶部:function scrollTop(){
//         if((document.body.scrollTop || document.documentElement.scrollTop) != 0){
//           document.body.scrollTop = document.documentElement.scrollTop = 0;
//         }
//       }
// Element.getBoundingClientRect().width = border-left-width + padding-left + width + padding-right + border-right-width
// Element.getBoundingClientRect().height = border-top-width + padding-top + height + padding-bottom + border-bottom-width
// top: 元素顶部相对于视口的纵坐标
// left: 元素左边界相对视口的横坐标
// right: 元素右边界相对视口的横坐标
// bottom:元素底部相对于视口的纵坐标
// bottom = top + height
// right = left + width
//

























以上是关于页面位置的主要内容,如果未能解决你的问题,请参考以下文章

js 页面滚动到指定位置

页面加载时自动滚动到指定位置!如何做

在相同位置重新加载页面

根据页面的顶部和左侧位置在页面上显示 Blazor 组件

如何用jquery实现页面滚动到指定位置后触发事件的效果?

vue返回上一页面时回到原先滚动的位置