网页制作,页面设计,我在网页 body里面设置了背景图片,如何用js让背景图片每隔几秒就换一次

JavaScript026

网页制作,页面设计,我在网页 body里面设置了背景图片,如何用js让背景图片每隔几秒就换一次,第1张

<HTML>

<HEAD>

<TITLE>New Document </TITLE>

<style type="text/css">

.bg1 { background:#eee}

.bg2 { background:#ccc}

</style>

<SCRIPT LANGUAGE="JavaScript">

<!--

function SetBackground()

{

var obj = document.getElementsByTagName("body")[0]

if (obj.className == "bg1") obj.className = "bg2"

else obj.className = "bg1"

}

window.setInterval(SetBackground,1000)

//-->

</SCRIPT>

</HEAD>

<BODY>

</BODY>

</HTML>

修改.bg1 { background:#eee} .bg2 { background:#ccc} 背景改成你的图片就行了

js 切换body的背景

在images中添加1.jpg 2.jpg 3.jpg 三张图片就好了

<html>

<head>

<title>New Document </title>

</head>

<body>

</body>

</html>

<script type="text/javascript">

function qiehuan(i){

var n = i

if(n>3)

n=1

var bg = document.body||document.documentElement

bg.style.background = "url('images/"+n+".jpg')"

n++

setTimeout("qiehuan("+n+")",1000)//1秒轮换一张 2000为两秒

}

qiehuan(1)

</script>

//JS部分

function bgRoll(){

//变量 j 控制图片数量,此例中为 3 张背景轮流更换,名称分别bt1.jpg、bt2.jpg、bt3.jpg。

//变量 time 控制切换时间,此例中为每经过 5000毫秒 更换一次图片 (1000毫秒为1秒)

var i=2

var j=3

var time=5000

setInterval(function(){

document.getElementsByTagName("body").item(0).style.backgroundImage="url(bt"+i+".jpg)"

if(i<j){

i++

}

else{

i=1

}

},time)

}

window.onload=function(){

bgRoll()

} <!-- HTML部分 -->

<body style="background-image:url(bt1.jpg)">

另外,用JQ能更方便一点,但你刚接触JS还是用原生代码比较助于理解。