Faire défiler un div

Voici une fonction qui vous permettra de faire se déplacer (verticalement) un DIV ou n'importe quel autre élément placé en position:absolute;

Code

javascript

var total=0;
function moveDiv(divId,direction,stop,time) {
	var pos=document.getElementById(divId).style.top;
	pos=(pos!="")?parseInt(pos)+direction:direction;
	if (total!=stop) {
		if ((stop-total)<Math.abs(direction)) {direction=(stop-total)*(direction/Math.abs(direction))};
		total=total+Math.abs(direction);
		document.getElementById(divId).style.top=pos+"px";
		setTimeout("moveDiv('"+divId+"',"+direction+","+stop+","+time+")",time);
	}	
	else {
		total=0;
	}
}

Utilisation

Voici comment utiliser cette fonction

html4strict

<a href="#" onclick="moveDiv('monDiv',-40,550,5)">CLIC</a>

monDiv correspond à l'id de l'élément à déplacer.
-40 est le sens et la vitesse de déplacement de l'élément.
550 est la limite de déplacement (une foi qu'il se sera déplacer de 550 px la fonction s'arrêtera).
5 correspond au temps d'attente (en milliseconde) entre chaque déplacement.

Attention, la lecture de la position de l'objet ce fait par l'attribut CSS “top”
Il est donc essentiel de le définir.
Vous ne pourrez le définir que dans l'attribut style de l'objet (et pas dans une classe.)
Comme ceci : <div style=“top:125px” class=“maclasse”>test</div>