博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
图片居中
阅读量:7175 次
发布时间:2019-06-29

本文共 1463 字,大约阅读时间需要 4 分钟。

<div id="divbigimage" style="display:none;position:absolute;">

<img src="" id="big" />
</div>

var divx = document.body.clientWidth;//获取当前页面的宽度

var divy = document.body.clientHeight;//
document.getElementById("big").src=obj_big;
var image=document.getElementById("big");
var divmove = document.getElementById("divbigimage");
divmove.style.left = (divx-image.width)/2+'px';//image.width图片宽度
divmove.style.top = (divy-image.height)/2+'px';

 

ps:

 function getInfo()

        {
            var s = "";
            s += " 网页可见区域宽:"+ document.body.clientWidth+" ";
            s += " 网页可见区域高:"+ document.body.clientHeight+" ";
            s += " 网页可见区域宽:"+ document.body.offsetWidth + " (包括边线和滚动条的宽)"+" ";
            s += " 网页可见区域高:"+ document.body.offsetHeight + " (包括边线的宽)"+" ";
            s += " 网页正文全文宽:"+ document.body.scrollWidth+" ";
            s += " 网页正文全文高:"+ document.body.scrollHeight+" ";
            s += " 网页被卷去的高(ff):"+ document.body.scrollTop+" ";
            s += " 网页被卷去的高(ie):"+ document.documentElement.scrollTop+" ";    
            s += " 网页被卷去的左:"+ document.body.scrollLeft+" ";
            s += " 网页正文部分上:"+ window.screenTop+" ";
            s += " 网页正文部分左:"+ window.screenLeft+" ";      
            s += " 屏幕分辨率的高:"+ window.screen.height+" ";
            s += " 屏幕分辨率的宽:"+ window.screen.width+" ";
            s += " 屏幕可用工作区高度:"+ window.screen.availHeight+" ";
            s += " 屏幕可用工作区宽度:"+ window.screen.availWidth+" ";
            s += " 你的屏幕设置是 "+ window.screen.colorDepth +" 位彩色"+" ";
            s += " 你的屏幕设置 "+ window.screen.deviceXDPI +" 像素/英寸"+" ";
            s += " window的页面可视部分实际高度(ff) "+window.innerHeight+" ";    
            alert (s);
        };

转载于:https://www.cnblogs.com/hgxbo/p/5408242.html

你可能感兴趣的文章
十个必不可少的网络安全测试工具
查看>>
我的友情链接
查看>>
思达报表工具Style Report基础教程—在数据块中设置Where、Having条件
查看>>
计算机领域最新技术报告:云数据库
查看>>
ora-01658 unable to create initial extent for segment in tablespace
查看>>
Centos利用 rsync+inotify实现实时同步
查看>>
Difference Between VMFS 3 and VMFS 5
查看>>
time命令小结
查看>>
kali 1.0.9a 启动Metasploit
查看>>
python 数字
查看>>
Android入门及环境搭建
查看>>
我的友情链接
查看>>
flume source channel sink
查看>>
Axis2+spring的webservice小例子
查看>>
Android UI系列-----ScrollView和HorizontalScrollView
查看>>
Mac OS X 背后的故事
查看>>
AgileEAS.NET敏捷开发平台及案例下载(持续更新)-索引
查看>>
修改hosts文件无效?附解决办法
查看>>
OpenCV编程->Haar训练(1)
查看>>
Oracle_071_lesson_p10
查看>>