背景自适应代码

来源:互联网 发布:oracle数据库打不开 编辑:程序博客网 时间:2024/05/17 22:57

在js文件中写入:

function resizeBg(winHeight){
if(winHeight>712){
var diffHeight=winHeight-652;
$(".AboutBg").attr("style","padding-bottom:"+diffHeight+"px");
}
}

在html页面中写入:

<script type="text/javascript">
resizeBg($(window).height());
$(window).resize(function(){
resizeBg($(window).height());
});
</script>

页面环境:content中的内容距离底部footer的距离是60px,即padding-boottom:60px,由于实际环境中个屏幕高度不同,footer需要固定在底部不动,那content中内容的padding-bottom需要是一个变量,随着屏幕高度的变大而变大,计算方式如上,712是开发者页面的实际总高度,随着分辨率增大,padding-bottom的值为:实际屏幕高度-开发者屏幕高度+60(预先设定的padding值)

1 0
原创粉丝点击