JS实现弹出框文字居中

最新推荐文章于 2023-09-01 11:03:54 发布

绵洋的PhD之路

最新推荐文章于 2023-09-01 11:03:54 发布

阅读量1.5k

点赞数

分类专栏： web

本文链接：https://blog.csdn.net/liyang110703/article/details/62434360

版权

这篇博客介绍了如何使用JavaScript实现弹出框在页面中水平和垂直居中。通过获取窗口显示区尺寸和对象尺寸，计算出居中位置，并根据浏览器类型调整滚动条偏移值，最终设置对象的位置。

摘要由CSDN通过智能技术生成

jscript.dom.layerCenterH=function(inObj){//设置水平居中
var lca;
var lcb;
var lcx;
var iebody;
var dsocleft;
if(window.innerWidth){
lca=window.innerWidth; //窗口的文档显示区宽度同理innerheight
}else{
lca=document.body.clientWidth;//网页可见区域宽
}
lcb=inObj.offsetWidth;//当前对象的宽度
lcx=(Math.round(lca/2))-(Math.round(lcb/2));
//document.compatMode判断当前浏览器采用的渲染方式
iebody==(document.compatMode&&document.compatMode!="BackCompat")?document.documentElement:document.body;
//document.all是页面内所有元素的一个集合。可以判断浏览器是否为IE
//pageXOffset 设置或返回当前页面相对于窗口显示区左上角的 X 位置。
// pageYOffset 设置或返回当前页面相对于窗口显示区左上角的 Y 位置。
dsocleft=document.all?iebody.scrollLeft:window.pageXOffset;
inObj.style.left=lcx+dsocleft+"px";
}