码迷,mamicode.com
首页 > Web开发 > 详细

js 更换背景图

时间:2015-10-16 17:08:42      阅读:167      评论:0      收藏:0      [点我收藏+]

标签:

<!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>

 

js 更换背景图

标签:

原文地址:http://www.cnblogs.com/wzzl/p/4885636.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!