Vincent Rousseau, développeur Web Reims

Rien n'arrête nos amis graphistes, rien ! Ils font leurs maquettes sous Photoshop sans se soucier des contraintes du Web. Et qui se retrouve à essayer de faire des choses impossibles après ? Les pauvres développeurs :(

Enfin, ce qui n'était pas possible il y a quelques année (ou très difficile) ne l'est plus aujourd'hui, notamment grâce à l'essors des bibliothèques javascript tel que jQuery ou Mootools.

Je vous fais part aujourd'hui d'un plugin jQuery pour mettre en forme les ascenceurs de votre navigateur : jScrollPane.

Utilisation

Après avoir inclus la dernière version de jQuery, on inclus à la suite dans le head le plugin :

<script type="text/javascript" src="scripts/jScrollPane.js"></script>

puis le fichier CSS :

<link rel="stylesheet" type="text/css" media="all" href="jScrollPane.css" />

Ensuite, sélectionnez le(s) selecteur(s) sur le(s)quel(s) on applique le scroll :

$('.scroll-pane').jScrollPane();

Le scrollbar a bien été remplacé, il ne reste plus qu'à bidouiller le CSS pour mettre en forme à votre guise !

Les atuces de monsieur Meuh :

Comme vous pouvez le remarquer, le scroll ne fonctionne pas en natif sur le plugin. Il vous faudra mettre un nouveau plugin : Mouse wheel plugin. A inclure dans le head entre vos fichiers jQuery et jScrollPane.