整个身体背景的定时背景变化

timed background change for whole body background

本文关键字：背景 变化 定时      更新时间：2023-09-26

我正在尝试对队列进行背景更改。这就是我要改变的背景:

var bgarray = new Array();
var curbg = 0;
function getBackgrounds() {
    var totalbg = 4;
    for (var i = 0; i < totalbg; i++) {
        bgarray[i] = 'url("img/' + i + '.jpeg")';
    }
}
function changeBackground() {
    debugger;
    if (curbg === (bgarray.length - 1)) {
        curbg = 0;
    }
    var bgurl = bgarray[curbg];
    curbg++;
    $(document.body).animate({
        'background-image': bgurl
    }, 1000);
}

我在调用代码中使用了setInterval(changeBackground, 5000);，但它不会改变背景。

控制台没有记录任何错误，文件确实存在。

知道为什么没有变化吗?

var bgarray = ['https://2.bp.blogspot.com/-AXkkbmFRErs/TjCZIWGawfI/AAAAAAAAAlk/lT8yTGBYh38/s1600/Rick-Roll3.png','http://cdn.hitfix.com/photos/5203303/Rick-Roll-Mash-Up.jpg','http://stream1.gifsoup.com/view2/1569461/rick-roll-o.gif','https://media4.giphy.com/media/lKm3FhZ6xMkFO/200_s.gif'];
var curbg = 0;
function changeBackground() {
    curbg++;
    if (curbg === (bgarray.length)) {
        curbg = 0;
    }
    var bgurl = bgarray[curbg];
    $(document.body).css('background-image','url("'+bgurl+'")');
}
setInterval(changeBackground,4000);
body {
  transition: background-image 1s;
  background-size: cover;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

这是你想要完成的吗?

相关文章：