使用计时器更改背景图片的Jquery

Question

使用计时器更改背景图片的Jquery

6

我在这个网站上使用了两张背景图片，我想让它们每5秒自动更换。请有经验的人查看我的jQuery代码并告诉我哪里出了问题？

$(function() {
    var body = $(‘body’);
    var backgrounds = new Array(
        ‘url(images/hso-palmtree-background.jpg)’,
        ‘url(images/hso-boardwalk-background.jpg)’
    );

    var current = 0;

    function nextBackground() {
        body.css(
           ‘background’,
            backgrounds[current = ++current % backgrounds.length]
        );

        setTimeout(nextBackground, 5000);
    }

    setTimeout(nextBackground, 5000);
    body.css(‘background’, backgrounds[0]);
});

- Joseph Montecalvo

现在它什么也没做。没有背景显示。但我确定它正在获取图像，因为我用CSS将其中一个设置为我的背景，以确保它可以工作。 - Joseph Montecalvo

好的。下次提问时，请将该信息放入其中。现在，如果您打开Firebug或类似工具，是否有任何错误？ - Colleen

不，没有，这就是为令我感到困惑的原因。有没有任何一种方法可以写出来？顺便说一下，我在实际的CSS中从未声明过任何背景图像，因为我是用Jquery来做的。 - Joseph Montecalvo

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Majid Fouladpour · Accepted Answer

你的代码是正确的，你只需要更改反引号。将‘更改为'。

这是一个已清理过的修订版：http://jsfiddle.net/X2NqX/

$(function () {
    var body = $('body');
    var backgrounds = [
      'url(http://static.jsbin.com/images/jsbin_static.png)', 
      'url(http://static.jsbin.com/images/popout.png)'];
    var current = 0;

    function nextBackground() {
        body.css(
            'background',
        backgrounds[current = ++current % backgrounds.length]);

        setTimeout(nextBackground, 5000);
    }
    setTimeout(nextBackground, 5000);
    body.css('background', backgrounds[0]);
});