使用Javascript更改背景图像,仅显示第一个图像一次

时间:2015-10-07 03:33:07

标签: javascript jquery html

我正在使用以下代码来更改html页面的背景图像,但我只希望第一个图像显示一次,其他图像保持旋转。寻求有关我应该更改/添加到此代码的帮助以实现此目的

<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<script>
$(document).ready(function() {
    var header = $('body');

    var backgrounds = new Array(
        'url(http://www.example.com/image-1.png)', 'url(http://www.example.com/image-2.png)', 'url(http://www.example.com/image-3.png)'
    );

    var current = 0;

    function nextBackground() {
        current++;
        current = current % backgrounds.length;
        header.css('background-image', backgrounds[current]);
    }
    setInterval(nextBackground, 7500);

    header.css('background-image', backgrounds[0]);
});
</script>

提前致谢

1 个答案:

答案 0 :(得分:0)

将nextBackground函数更改为:

function nextBackground() {
    current++;
    if (current === backgrounds.length)
        current = 1;
    header.css('background-image', backgrounds[current]);
}