首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > CSS >

想让一个div的背景一周7天每天都自动更换一张图片要如何做呢

2012-06-06 
想让一个div的背景一周7天每天都自动更换一张图片要怎么做呢?% if weekday(date)0 then %style type

想让一个div的背景一周7天每天都自动更换一张图片要怎么做呢?
<% if weekday(date)=0 then %>
<style type="text/css">
.bgimg{
background-image:url(img/7.jpg);
}
</style>
<% end if %>
<% if weekday(date)=1 then %>
<style type="text/css">
.bgimg{
background-image:url(img/1.jpg);
}
</style>
<% end if %>
<% if weekday(date)=2 then %>
<style type="text/css">
.bgimg{
background-image:url(img/2.jpg);
}
</style>
<% end if %>
<% if weekday(date)=3 then %>
<style type="text/css">
.bgimg{
background-image:url(img/3.jpg);
}
</style>
<% end if %>
<% if weekday(date)=4 then %>
<style type="text/css">
.bgimg{
background-image:url(img/4.jpg);
}
</style>
<% end if %>
<% if weekday(date)=5 then %>
<style type="text/css">
.bgimg{
background-image:url(img/5.jpg);
}
</style>
<% end if %>
<% if weekday(date)=6 then %>
<style type="text/css">
.bgimg{
background-image:url(img/6.jpg);
}
</style>
<% end if %>


----------------------------------------------------
上面是用VB实现class="bgimg"的div每天自动更换一张背景图片(7张不同的背景图片都做好放在img文件夹里了),但是上面这段代码不知道为何就是无法实现

请问下论坛的前辈们有没有什么办法解决?用js也可以!

[解决办法]

HTML code
<!DOCTYPE HTML><html>    <head>        <meta charset="gb2312" />        <title></title>        <style>        </style>            </head>    <body>        <div id="test"></div>        <script>            function $(el){                return typeof el == 'string' ? document.getElementById(el) : el;            }            var week = new Date().getDay(); //返回值是 0(周日) 到 6(周六)            alert(week)                        $('test').style.background = 'url('+week+'.jpg)'                                </script>    </body></html>
[解决办法]
用JS很容易实现。

HTML code
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>无标题文档</title><script type="text/javascript">var ar = [    'img/7.jpg',    'img/1.jpg',    'img/2.jpg',    'img/3.jpg',    'img/4.jpg',    'img/5.jpg',    'img/6.jpg']window.onload = function() {    var d = new Date();    document.getElementById('demo').style.backgroundImage = 'url(' + ar[d.getDay()] + ')';}</script></head><body><div id="demo"></div></body></html>
[解决办法]
跟AJAX完全没关系,检查一下页面是否已经定义了window.onload函数,把所有需要在onload事件触发后执行的代码合并到一起,否则后定义的window.onload处理函数会覆盖前面的。

热点排行