如何在一段时间后更改<header>背景图像</header>

Question

这是我目前的HTML代码：

http://pastebin.com/CRNVzhZd

我需要制作它，以便背景图像在几秒钟后自动更改为几张图像，如下所示：

图像1 = 3秒 3秒后将图像1更改为图像2 显示图像2 3秒等....

如何做到这一点？ jQuery的？ Ajax的？

Answer 1

这可能是一个解决方案Fiddle

<script type="text/javascript">
$(document).ready(function(){
    var arr=['http://s14.postimg.org/p6ds42qb5/foto22.jpg','http://s17.postimg.org/or0zqcqov/foto33.jpg']
    var count=-1
    function changeImage(){
        count++
        if(count>=arr.length){
            count=0
            }
        $('#head').attr('style','background-image:url('+arr[count]+')') 
        }


    setInterval(function() { changeImage() },1000)
})
</script>

如果您需要添加其他图片，则必须在阵列中输入其位置。