Toutes les clefs pour réussir dans le e-commerce

Mes modules Prestashop

Une scrollbar en javascript

J’ai trouvé ici un très bon script pour créer des scroll bar en javascript et qui du coup peuvent être complètement personnalisées.

Le seul défaut de ce script est que la roulette n’est pas prise en charge sur firefox, j’ai donc étudié le code et le correctif était tout simple, le voici:

Dans jsScrollbar.js ligne 38 dans this.reset = function
ajoutez la ligne suivante après this.addEvent this._addEvent(this._src.content, “mousewheel”, this._scrollbarWheel);



this._addEvent(this._src.content, "DOMMouseScroll", this._scrollbarWheel);


Dans this._scrollbarWheel = function (e) remplacez le code suivant:


if (e.wheelDelta >= 120) dir = -1;
if (e.wheelDelta <= -120) dir = 1;

Par



if(e.wheelDelta) {
if (e.wheelDelta >= 120) dir = -1;
if (e.wheelDelta <= -120) dir = 1;
}
else {
if(e.detail<0) dir= -1;
if(e.detail>0) dir= 1;
}


Et voila.

Je vous mets le fichier zip ici (non corrigé, je vous laisse le faire) au cas où le site d’origine ne fonctionnerait plus.

Poster un Commentaire

11 Commentaires sur "Une scrollbar en javascript"

Recevoir un email pour
avatar
Trier par:   plus récent | plus vieux | Plus de vote
Matt
Invité

Merci :-) Dans le même genre j’ai souvent utilisé jScrollPane qui est très complet et continue d’évoluer : http://jscrollpane.kelvinluck.com/

Malheureusement, aucun des deux ne fonctionne sur ios (il y a jscrolltouch mais leur site semble raide).

KevOne
Invité

Bonjour,

Je suis tombé sur le blog il y a une dizaine de jours, le script est génial, tout fonctionne à merveille … un peu trop d’ailleurs :-)

C’est à dire que lorsque j’applique toute la méthode à une page, la div “Scroller-1”, qui est censée défilée “uniquement” lorsqu’il y a trop de texte sur la page, défile même s’il n’y a que deux lignes.

Comment puis-je faire pour que le scroll ne se déclence QUE lorsque le texte dépasse de la fenêtre ?

Merci d’avance pour votre aide

etib
Invité
etib

Bonjour, j’ai telecharge le .zip.
Je souhaite utiliser la scrollbar de l’exemple 4. Quels codes/fichiers dois-je intégrer à mon code (je demande car il y a 7 fichiers .js dans le .zip…) ?

Merci d’avance

frhyul45
Invité
frhyul45

Bonjour, merci pour le script, il marche parfaitement, cependant j’aimerais augmenter la vitesse de défilement, pouvez vous me dire quel ligne modifiée ?

Merci.

frhyul45
Invité
frhyul45

Merci pour votre réponse, j’ai essayer de modifier les variables mais rien n’a changé.
J’ai opté pour une scrollbar avec deux boutons, la vitesse n’est plus génante.

Merci encore, bonne continuation.

alexandra
Invité
alexandra

bonjour,
bien d’accord avec vous, j’ai trouvé ce script super. Je l’ai implémenté sur le site que je suis en train de faire (je ne suis pas informaticienne mais je fais ce que je peux!) et ca marche très bien. seule problème : la barre de défilement n’est pas assez longue et une partie de mon contenu n’apparait pas !
http://www.sequoiapressing.fr/SequoiaPresse.html
il manque la fin de la page !
Je ne sais pas quoi modifier dans le code pour résoudre ce problème (j’ai réussi à l’implémenter mais plus par tatonnement que par réelle compréhension).
Auriez vous la gentillesse de m’éclairer ?
Merci !!!
Cordialement
Alexandra

Dov
Invité
Dov

Bonjour,

j’ai téléchargé le script et je le trouve extra !

Je souhaiterais utiliser l’exemple 4 sur mon site mais, ayant peu de connaissance en javascript, je ne sais pas comment faire pour avoir la même scrollbar mais horizontalement en dessous du texte.

Merci d’avance !!
Dov

wpDiscuz