Version complète: jsB@nk » Image » Wall-Jumping Crazy Ball
URL: https://www.javascriptbank.com/crazy-jumping-wall-ball.html
Personne 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 complète: jsB@nk » Image » Wall-Jumping Crazy Ball
URL: https://www.javascriptbank.com/crazy-jumping-wall-ball.html
<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--><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-->
http://javascriptbank.com/javascript/image/rd.gif