关于页面分辨率的问题

cloud_scorpion 2007-07-25 08:32:56
我现在有个页面,背景是个图,我现在想根据分辨率的不同,来改变背景图。
比如:当分辨率是1024*768的时候就用一个背景图
当分辨率是其他分辨率的时候,换用另一个背景图

body {
margin-top: 0px;
margin-bottom: 0px;
background-color: #F2F2F2;
background-image: url(pic/common/bg1.jpg);
}

即根据分辨率的不同,修改:background-image: url(pic/common/bg1.jpg);这行代码的背景图
...全文
185 3 打赏 收藏 转发到动态 举报
写回复
用AI写文章
3 条回复
切换为时间正序
请发表友善的回复…
发表回复
cloud_scorpion 2007-07-25
  • 打赏
  • 举报
回复
谢谢net_lover(【孟子E章
cgisir 2007-07-25
  • 打赏
  • 举报
回复
<head>
<style type="text/css">
body {
margin-top: 0px;
margin-bottom: 0px;

}
.body_1024{background:#F2F2F2 url(pic/common/bg1.jpg);}
.body_1280{background:#F2F2F2;}

</style>
<script type="text/javascript">
function getPageSize(){

var xScroll, yScroll;

if (window.innerHeight && window.scrollMaxY) {
xScroll = document.body.scrollWidth;
yScroll = window.innerHeight + window.scrollMaxY;
} else if (document.body.scrollHeight > document.body.offsetHeight){ // all but Explorer Mac
xScroll = document.body.scrollWidth;
yScroll = document.body.scrollHeight;
} else { // Explorer Mac...would also work in Explorer 6 Strict, Mozilla and Safari
xScroll = document.body.offsetWidth;
yScroll = document.body.offsetHeight;
}

var windowWidth, windowHeight;
if (self.innerHeight) { // all except Explorer
windowWidth = self.innerWidth;
windowHeight = self.innerHeight;
} else if (document.documentElement && document.documentElement.clientHeight) { // Explorer 6 Strict Mode
windowWidth = document.documentElement.clientWidth;
windowHeight = document.documentElement.clientHeight;
} else if (document.body) { // other Explorers
windowWidth = document.body.clientWidth;
windowHeight = document.body.clientHeight;
}

// for small pages with total height less then height of the viewport
if(yScroll < windowHeight){
pageHeight = windowHeight;
} else {
pageHeight = yScroll;
}

// for small pages with total width less then width of the viewport
if(xScroll < windowWidth){
pageWidth = windowWidth;
} else {
pageWidth = xScroll;
}


arrayPageSize = new Array(pageWidth,pageHeight,windowWidth,windowHeight)
return arrayPageSize;
}
window.onload=function(){
var ps=getPageSize();
switch (Number(ps[0])){
case 1024:
document.body.className="body_1024";
break;
case 1280:
document.body.className="body_1280";
break;
}
}
</script>
</head>
<body class="body_1024">
...
</body>
孟子E章 2007-07-25
  • 打赏
  • 举报
回复
<body onload="s()">
<script>
function s()
{
if(window.screen.width==1024)
{
document.body.style.backgroundImage="url(1.jpg)"
}
else
document.body.style.backgroundImage="url(2.jpg)"

}
</script>

61,111

社区成员

发帖
与我相关
我的任务
社区描述
层叠样式表(英文全称:Cascading Style Sheets)是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集)等文件样式的计算机语言。
社区管理员
  • HTML(CSS)社区
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告
暂无公告

试试用AI创作助手写篇文章吧