Une image qui vole...

Description

Pour modifier, j'ai laissé des annotations dans le code ! ;-)

Source / Exemple :


<HTML>
<HEAD>
<TITLE>Vole</TITLE>

<SCRIPT language=JavaScript>

var ballWidth = 100; // prendre la largeur de l'espace où se déplacera l'image... Plus le chiffre est grand moins y'a d'espace : c'est pas très logique je sais !Essayez de mettre 1
var ballHeight = 100; // prendre la hauteur du l'espace où se déplacera l'image... Plus le chiffre est grand moins y'a d'espace : c'est pas très logique je sais !Essayez de mettre 1
var BallSpeed = 2;  // La vitesse de l'image : de 1 à 50, le plus élevé est le plus rapide
var maxBallSpeed = 80;
var xMax;
var yMax;
var xPos = 0;
var yPos = 0;
var xDir = 'right';
var yDir = 'down';
var superballRunning = true;
var tempBallSpeed;
var currentBallSrc;
var newXDir;
var newYDir;
var bascl = 0

function initializeBall()
{
	if (document.all)
	{
		xMax = document.body.clientWidth
		yMax = document.body.clientHeight
		document.all("superball").style.visibility = "visible";
	}
	else if (document.layers)
	{
		xMax = window.innerWidth;
		yMax = window.innerHeight;
		document.layers["superball"].visibility = "show";
	}
	if(bascl == 0)
	{
		bascl = 1
		setTimeout('moveBall()',400);
	}
}

function moveBall()
{
	if (superballRunning == true)
	{
		calculatePosition();
		if (document.all)
		{
			document.all("superball").style.left = xPos + document.body.scrollLeft;
			document.all("superball").style.top = yPos + document.body.scrollTop;
		}
		else if (document.layers)
		{
			document.layers["superball"].left = xPos + pageXOffset;
			document.layers["superball"].top = yPos + pageYOffset;
		}
		setTimeout('moveBall()',30);
	}
}

function calculatePosition()
{
	if (xDir == "right")
	{
		if (xPos > (xMax - ballWidth - BallSpeed))
		{
			xDir = "left";
		}
	}
	else if (xDir == "left")
	{
		if (xPos < (0 + BallSpeed))
		{
			xDir = "right";
		}
	}
	if (yDir == "down")
	{
		if (yPos > (yMax - ballHeight - BallSpeed))
		{
			yDir = "up";
		}
	}
	else if (yDir == "up")
	{
		if (yPos < (0 + BallSpeed))
		{
			yDir = "down";
		}
	}
	if (xDir == "right")
	{
		xPos = xPos + BallSpeed;
	}
	else if (xDir == "left")
	{
		xPos = xPos - BallSpeed;
	}
	else
	{
		xPos = xPos;
	}
	if (yDir == "down")
	{
		yPos = yPos + BallSpeed;
	}
	else if (yDir == "up")
	{
		yPos = yPos - BallSpeed;
	}
	else
	{
		yPos = yPos;
	}
}

if (document.all||document.layers) window.onload = initializeBall;
{
	window.onresize = initializeBall;
}
</SCRIPT>

</HEAD>
<BODY>

<DIV id=superball style="HEIGHT: 120px; LEFT: 0px; POSITION: absolute; TOP: 0px; VISIBILITY: hidden; WIDTH: 140px">
<A href="http://www.paroles-et-musiques.fr.st">
<IMG border=0 name=superballImage src="yoda.jpg" ALT="Allez-y !"></A></DIV>
</BODY>
</HTML>

Conclusion :


Questions, commentaires, n'hésitez pas !
A+
V.K.

Codes Sources

A voir également

Vous n'êtes pas encore membre ?

inscrivez-vous, c'est gratuit et ça prend moins d'une minute !

Les membres obtiennent plus de réponses que les utilisateurs anonymes.

Le fait d'être membre vous permet d'avoir un suivi détaillé de vos demandes et codes sources.

Le fait d'être membre vous permet d'avoir des options supplémentaires.