Hello à tous,
J'essaie de faire un scroll en JS, car le scrollbar standard n'est pas terrible. Bref… mon code marche très bien sur Sarafi, mais sur Firefox, c'est pas terrible : on clique, on déplace, on déclique : OK. Mais si on reclique et on redéplace, ça a tendance à foirer.
Je n'ai rien trouver sur le sujet. C'est sûrement un erreur à la c** mais ça fait deux jours que je cherche et j'arrive pas à mettre la main dessus. Alors je m'invoque l'aide des maîtres
 
Voici le code, commenté :
Je répète que ça marche bien sur Safari
 
Merciiii
      
      
    J'essaie de faire un scroll en JS, car le scrollbar standard n'est pas terrible. Bref… mon code marche très bien sur Sarafi, mais sur Firefox, c'est pas terrible : on clique, on déplace, on déclique : OK. Mais si on reclique et on redéplace, ça a tendance à foirer.
Je n'ai rien trouver sur le sujet. C'est sûrement un erreur à la c** mais ça fait deux jours que je cherche et j'arrive pas à mettre la main dessus. Alors je m'invoque l'aide des maîtres
 Voici le code, commenté :
<script type="text/javascript">
var monCurseur = null;
var maTracklist = null;
var posInitClick = null;
var posInitCurs = 0;						// le curseur est une div style="position:relative; top:0";
var deplaCurs = null;
var depassement = null;
onScrollMouseDownHandler = function(event, nombrePistes) {									// sur le mousedown
	var hauteurBloc = 55*nombrePistes;															// on calcule la hauteur du contenu à scroller
	depassement = hauteurBloc - 330;															// et la hauteur de la partie cachée qui déterminera la hauteur max du scroll
	
	if (nombrePistes > 6) {
		monCurseur = document.getElementById('curseurB'); 										// Le curseur du scroll que l'on drag avec la souris
		maTracklist = document.getElementById('movingTracklist'); 								// le contenu qui va scroller à l'intérieur d'uve div overflow:hidden
		posInitClick = event.clientY; 															// on enregistre la position de la souris au début du scroll
		posInitCurs = window.getComputedStyle(monCurseur, null).getPropertyValue("margin-top"); // la position du curseur au début du scroll
		posInitCurs.replace("px", ""); 															// bon c'est pas très catholique, mais pour faire des soustraction, mieux vaut tout passer en INT [smile]
		posInitCurs = parseInt(posInitCurs);
		document.addEventListener('mousemove', onMouseMoveHandler, false); 						// on écoute le déplacement de la souris
		document.addEventListener('mouseup', onScrollUpHandler, false); 						// et le relachement du bouton pour arrêter le scroll 
	}
}
	
onMouseMoveHandler = function(event){															// lorsque la souris bouge
	deplaCurs = event.clientY-posInitClick; 														// on calcule le déplacement de la souris, et donc du curseur, entre la position actuelle et la position initiale de la souris au moment du mouseDown
	posFinCurs = posInitCurs + deplaCurs; 															// on calcule la nouvelle position du curseur
	if (posFinCurs > 0 && posFinCurs < 310){ 														// tant que le curseur ne sort pas des limites
		monCurseur.style.marginTop = posFinCurs + 'px';												// on deplace le curseur en hauteur
		maTracklist.style.marginTop = Math.round(-posFinCurs*depassement/310) + 'px';				// ainsi que le contenu proportionnellement [tiens, pourquoi le commentaire ne marche pas ?]
	}																							
}
var onScrollUpHandler = function(event) {														// lorsqu'on relache le bouton de la souris
	document.removeEventListener('mousemove', onMouseMoveHandler, false);							// on enlève l'écouteur sur le mousemove
	if (posFinCurs<10){																				// si le curseur est à moins de 10 pixels de la position haute
		monCurseur.style.marginTop = 0;																	// on le colle en haut
		maTracklist.style.marginTop = 0;																// idem pour le contenu	
	}
	else if (posFinCurs>300) {																		// si le curseur est à moins de 10 pixels de la position basse
		monCurseur.style.marginTop = '310px';															// on le colle en bas
		maTracklist.style.marginTop = -depassement + 'px';												// idem pour le contenu
	}
}
</script>
Je répète que ça marche bien sur Safari
 Merciiii