Question

我想编写一个javascript函数，每隔24小时更改一次背景图片30天。

例如，我有4张图片，image1.jpg，image2.jpg，image3.jpg和image4.jpg。

我想在星期一显示image1.jpg。然后到午夜我想自动换成image2.jpg等等。

我喜欢使用像这样的java脚本函数

function changeImg() {
var now = new Date(),
    hours=now.getHours(),
    minutes=now.getMinutes(),
    seconds=now.getSeconds(),
    dayD=now.getDate(),
    dayM=now.getMonth()+1,
    datY=now.getFullYear(),
    timer = setTimeout("changeImg()",200);
}

var imgArray =  new imgArr[xyz.png,abc.png,........,30.png]

现在我的问题是如何在24小时后自动更改图像。如果我使用for循环来增加计数器以更改图像它将起作用。并且这是正确的方法，如果我使用这种方式是计时器将保持以前的计数器值。

我希望每天早上9点，背景图片都会改变。

Answer 1

这应该是服务器端任务。但是，如果你必须使用JavaScript，那么......

将其放在页面的部分或作为外部脚本文件。

<script>

function render_image() {
    var images = [
        '00001.jpg',
        '00002.jpg',
        '00003.jpg',
        '00004.jpg',
        '00005.jpg',
        '00006.jpg',        
    ]

    // define the start date (alter this)
    var first = new Date("2011-09-03");

    // which image
    var src = images[
       // count days since start (int)
       (((new Date().getTime() - first.getTime())
         / 86400 / 1000) | 0)
       % images.length
    ];

    // create image element
    var im = document.createElement('img');
    im.src = src;

    // return code
    var di = document.createElement('div');
    di.appendChild(im);
    return di.innerHTML;
}

</script>

将此信息放在html页面中您希望图像显示的位置。

<script> document.write(render_image()); </script>

Answer 2

我建议设置超时不超过每分钟。在超时中，检查日期，如果已更改，则从列表中获取图像，然后将新URL写入文档中的适当位置。在超时结束时，始终开始下一个超时。不需要循环。

一段时间后图像的变化

2 个答案: