js控制使div⾃动适应居中
⼀直都在想怎么样使弹出的DIV能在任何时候都是居中显⽰的，刚开始的时候是⽤CSS样式直接定义好层的位置，但是当页⾯很长的时候，或是浏览器窗⼝⼤⼩不是固定的时候就不能正确的显⽰，所以只好⽤JS来控制DIV的显⽰位置。⾸先再次详细解释⼀下JS中窗⼝和⽹页的⼏种尺⼨属性的含义：
document.body.clientWidth（⽹页可见区域宽）：是指浏览器显⽰⽹页的区域宽度，不包括浏览器的边框宽度和垂直滚动条的宽度。⼤⼩随着浏览器的窗⼝⼤⼩⽽改变。
document.body.clientHeight（⽹页可见区域⾼）：是指浏览器显⽰⽹页的区域所能看到的⾼度，不包括浏览器的边框宽度和⽔平滚动条的⾼度。⼤⼩随着浏览器的窗⼝⼤⼩⽽改变。
html怎么让所有内容居中
document.body.scrollTop（⽹页被卷去的⾼）：是指拉动垂直滚动条时⽹页上⾯被地址栏及菜单栏遮盖着的部分的⾼。
document.body.scrollLeft（⽹页被卷去的左）：是指拉动⽔平滚动条时⽹页左⾯被左边线遮盖着的部分的宽。
现在我们来分析⼀下程序该如何实现：
第⼀步我们要实现的是使层在弹出时绝对居中不去考虑是否有滚动条的情况。
1.计算出层距离显⽰区域左边和上边的位置
注意：divId指的是所要居中的层,divId.clientWidth为其宽度！＠
var divId = ElementByIdx("xxx");
var v_left=(document.body.clientWidth-divId.clientWidth)/2;
var v_top=(document.body.clientHeight-divId.clientHeight)/2;
2.把得到的值重新赋给DIV的left和top属性
divId.style.left＝v_left;
p=v_top;
说明：divId为DIV标签的id值
这样这个层就是居中显⽰的了。
第⼆步我们要实现的是使在拖动滚动条的情况下弹出的层也能居中。
其实很简单我们只要把拖动的宽度和⾼度加到前⾯计算出来的左边距和上边距中就OK 了。
v_left+=document.body.scrollLeft;
v_top+=document.body.scrollTop;
2.把得到的值重新赋给DIV的left和top属性
divId.style.left＝v_left;
p=v_top;
这样显⽰出来就是居中的了。
fat注：那个document。body其实可以⼀般化？

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。