首页 > 其他 > 详细

大图片随浏览器水平居中显示

时间:2016-04-05 16:15:46      阅读:153      评论:0      收藏:0      [点我收藏+]

 

 

css样式:

<style>
*{margin: 0; }
.ads-detail {
width: 1000px;
/*height: 1000px;*/
position: relative;
margin: 0 auto;
}
.ads-detail p{
position: absolute;
width:1920px;
left:-465px;
top:0px;
}

.ads-detail img {
display: block;
width: 100%;
}
</style>

js代码:
<script>
window.onload = function(){
//设置ads_detail高度
var arrP = document.getElementById("ads-detail").getElementsByTagName("p");
var adsHeight = 0;
for(var i = 0 ; i < arrP.length; i++){
adsHeight += arrP[i].clientHeight || arrP[i].offsetHeight;
}
document.getElementById("ads-detail").style.height = adsHeight  + "px";
};
</script>

html结构:
<div style=" width: 100%; overflow: hidden;">
<div class="ads-detail" id="ads-detail">
<p>
<img src="0e7422be-e329-4eb9-a1a3-f85491c18d14.jpg">
</p>
</div>
</div>

大图片随浏览器水平居中显示

原文:http://www.cnblogs.com/mengwei-ziyun/p/5355176.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!