js 更换背景图

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
    <style type="text/css">
        *{margin: 0;padding: 0}
        body{background: #dddddd}
        #div1{
            width: 100%;
            height: 100%;
        }
    </style>
</head>
<body id="div1" onload="showBgImage()">

</body>
</html>
<script>



    function showBgImage() {

        var curIndex = 0;           //定义开始索引 
        var timeInterval = 1000;
        //定义切换时间,   1s=1000ms 
        //定义存放图片数组      
        var arr = new Array();
        arr[0] = "images/240.png";    //给数组每一项赋值,就是添加图片路劲 
        arr[1] = "images/340.png";
        arr[2] = "images/240.png";
        arr[3] = "images/340.png";
        arr[4] = "images/240.png";
        arr[5] = "images/340.png";
        setInterval(changeImg, timeInterval);       //调用显示图片方法(参数为:方法名和切换时间) 
        function changeImg() {


            var obj = document.getElementById("div1");   //获得所要设置的元素                 
            if (curIndex == arr.length - 1) {
                curIndex = 0;
            } else {
                curIndex += 1;
            }
            obj.style.backgroundImage = "url(" + arr[curIndex] + ")";     //设置获得元素的背景图片       
        }

}
    </script>

 

posted @ 2015-10-16 16:30  A心语  阅读(1322)  评论(0编辑  收藏  举报
返回上一页
WEB前端|JS | jquery