»
AnglaisFranaisVietnamien

Imprimer - Wall-Jumping Crazy Ball - JavaScriptBank.com

Version complte: jsB@nk » Image » Wall-Jumping Crazy Ball
URL: http://www.javascriptbank.com/crazy-jumping-wall-ball.html

Wall-Jumping Crazy Ball © JavaScriptBank.comPersonne ne veut jouer à pong avec notre pauvre petite boule. Donc la balle pong joue avec les frontières de votre page. Eyecatching démonstration comment exploiter la puissance d'animations DHTML sans perdre de chargement heure et de la bande passante

Version complte: jsB@nk » Image » Wall-Jumping Crazy Ball
URL: http://www.javascriptbank.com/crazy-jumping-wall-ball.html



JavaScript
<SCRIPT><!-- Beginning of JavaScript -var x,yvar marginbottomvar marginleft=0var margintop=0var marginright// less is fastervar tempo=10// horizontal move (pixels) within time unitvar stepx=20// vertical move (pixels) within time unitvar stepy=20var timer// preloading of the four ballsimg0 = new Image();img0.src = "ld.gif";img1 = new Image();img1.src = "lu.gif";img2 = new Image();img2.src = "rd.gif";img3 = new Image();img3.src = "ru.gif";// wait 2 seconds after loading (to ensure that images are really loadedfunction setValues() {    var firsttimer= setTimeout("setValues2()",2000)}// check the width and the height of the document// gets the starting position of the ball by randomfunction setValues2() {if (document.all) {    marginbottom = document.body.clientHeight-50    marginright = document.body.clientWidth-50document.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-10document.ball.left=randommaker(marginright-30)+30   document.ball.top=10    moveball()}}// randomfunctionfunction 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*-1document.all.ball.style.posLeft-=10}if (document.all.ball.style.posLeft<=marginleft) {stepx=stepx*-1document.all.ball.style.posLeft+=10}if (document.all.ball.style.posTop>=marginbottom) {stepy=stepy*-1document.all.ball.style.posTop-=10}if (document.all.ball.style.posTop<=margintop) {stepy=stepy*-1document.all.ball.style.posTop+=10}}if (document.layers) {if (document.ball.left>=marginright) {stepx=stepx*-1document.ball.left-=10}if (document.ball.left<=marginleft) {stepx=stepx*-1document.ball.left+=10}if (document.ball.top>=marginbottom) {stepy=stepy*-1document.ball.top-=10}if (document.ball.top<=margintop) {stepy=stepy*-1document.ball.top+=10}}}function chooseimage() {if (document.all) {if (stepx <= 0 && stepy <=0) {ballimage.src="rd.gif"}if (stepx >= 0 && stepy <=0) {ballimage.src="rd.gif"}if (stepx <= 0 && stepy >=0) {ballimage.src="rd.gif"}if (stepx >= 0 && stepy >=0) {ballimage.src="rd.gif"}}if (document.layers) {if (stepx <= 0 && stepy <=0) {document.ball.document.ballimage.src="rd.gif"}if (stepx >= 0 && stepy <=0) {document.ball.document.ballimage.src="rd.gif"}if (stepx <= 0 && stepy >=0) {document.ball.document.ballimage.src="rd.gif"}if (stepx >= 0 && stepy >=0) {document.ball.document.ballimage.src="rd.gif"}}}// - End of JavaScript - --></SCRIPT><!--    This script downloaded from www.JavaScriptBank.com    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->


HTML
<BODY id=thisbody onload=setValues()><DIV id=ball style="POSITION: absolute; TOP: -50px"><IMG border=0 name=ballimage src="rd.gif" width="45" height="45"></DIV></BODY><!--    This script downloaded from www.JavaScriptBank.com    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->


Files
http://javascriptbank.com/javascript/image/rd.gif