您的位置:首页 > Web前端 > JavaScript

js 更换背景图

2015-10-16 16:30 911 查看
<!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>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: