一段时间间隔后图像的变化

Change of image after a time interval

本文关键字：变化 图像 一段时间      更新时间：2023-09-26

我想写一个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点的时候背景图像会改变

这应该是一个服务器端任务。但是如果你必须使用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>

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

相关文章：