<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <title>网页特效|Linkweb.cn/Js|---撞壁自动变换的图片效果</title> </head> <body onLoad="setValues()"> <SCRIPT> var x,y var marginbottom var marginleft=0 var margintop=0 var marginright // 速度，越小越快 var tempo=60 // 单位时间内水平移动的距离 var stepx=20 // 单位时间内上下移动的距离 var stepy=20 var timer // 图象的路径 img0 = new Image(); img0.src = "sto/01.gif"; img1 = new Image(); img1.src = "sto/02.gif"; img2 = new Image(); img2.src = "sto/03.gif"; img3 = new Image(); img3.src = "sto/04.gif"; // 延迟两秒开始运动 function setValues() { var firsttimer= setTimeout("setValues2()",100)} function setValues2() { if (document.all) { marginbottom = document.body.clientHeight-50 marginright = document.body.clientWidth-50 document.all.ball.style.posLeft=randommaker(marginright-30)+30 document.all.ball.style.posTop=10 moveball() } if (document.layers) { marginbottom = window.innerHeight-10 marginright = window.innerWidth-10 document.ball.left=randommaker(marginright-30)+30 document.ball.top=10 moveball() } } function randommaker(range) { rand=Math.floor(range*Math.random()) return rand } function moveball() { checkposition() chooseimage() if (document.all) { document.all.ball.style.posLeft+=stepx document.all.ball.style.posTop+=stepy timer=setTimeout("moveball()",tempo) } if (document.layers) { document.ball.left+=stepx document.ball.top+=stepy timer=setTimeout("moveball()",tempo) } } function checkposition() { if (document.all) { if (document.all.ball.style.posLeft>=marginright) { stepx=stepx*-1 document.all.ball.style.posLeft-=10 } if (document.all.ball.style.posLeft<=marginleft) { stepx=stepx*-1 document.all.ball.style.posLeft+=10 } if (document.all.ball.style.posTop>=marginbottom) { stepy=stepy*-1 document.all.ball.style.posTop-=10 } if (document.all.ball.style.posTop<=margintop) { stepy=stepy*-1 document.all.ball.style.posTop+=10 } } if (document.layers) { if (document.ball.left>=marginright) { stepx=stepx*-1 document.ball.left-=10 } if (document.ball.left<=marginleft) { stepx=stepx*-1 document.ball.left+=10 } if (document.ball.top>=marginbottom) { stepy=stepy*-1 document.ball.top-=10 } if (document.ball.top<=margintop) { stepy=stepy*-1 document.ball.top+=10 } } } function chooseimage() { if (document.all) { if (stepx <= 0 && stepy <=0) {ballimage.src="sto/01.gif"} if (stepx >= 0 && stepy <=0) {ballimage.src="sto/02.gif"} if (stepx <= 0 && stepy >=0) {ballimage.src="sto/03.gif"} if (stepx >= 0 && stepy >=0) {ballimage.src="sto/04.gif"} } if (document.layers) { if (stepx <= 0 && stepy <=0) {document.ball.document.ballimage.src="sto/01.gif"} if (stepx >= 0 && stepy <=0) {document.ball.document.ballimage.src="sto/02.gif"} if (stepx <= 0 && stepy >=0) {document.ball.document.ballimage.src="sto/03.gif"} if (stepx >= 0 && stepy >=0) {document.ball.document.ballimage.src="sto/04.gif"}}} </SCRIPT> <DIV id=ball style="POSITION: absolute; TOP: -50px"><IMG border=0 name=ballimage src="sto/01.gif"></DIV> </body> </html>
