web-dev-qa-db-fra.com

Comment faire un défilement horizontal sur la molette de la souris?

En ce moment, je tombe par hasard sur http://www.benekdesign.com/ . Ici, sur la molette de la souris, il effectue un défilement horizontal. Vraiment parlant je n'ai pas aimé cette fonctionnalité. C'était un peu irritant. Mais reste, S'il vous plaît dites-moi comment atteindre le même objectif.

Edité

Ok, Firebug dit qu'il utilise

/ * Horizontal Tiny Scrolling - un script de défilement régulier pour les sites Web horizontaux 2 (le frère du vertical "Tiny Scrolling") 3by Marco Rosella - http://www.centralscrutinizer.it/en/design/js-php/horizontal -tiny-scrolling 4 v0.6 - 14 février 2007

javascriptjqueryhtmlscrollhorizontal-scrolling
19
Rakesh Juyal

On dirait qu'il vient de mapper l'événement de la souris pour faire défiler la zone. Dans IE, cela est vraiment facile en utilisant simplement la méthode doScroll() - cela fera défiler la barre horizontale du montant que la barre verticale ferait normalement défiler. Les autres navigateurs ne supportent pas la méthode doScroll(), vous devez donc vivre avec le défilement d'un montant arbitraire:

var mouseWheelEvt = function (event) {
    if (document.body.doScroll)
        document.body.doScroll(event.wheelDelta>0?"left":"right");
    else if ((event.wheelDelta || event.detail) > 0)
        document.body.scrollLeft -= 10;
    else
        document.body.scrollLeft += 10;

    return false;
}
document.body.addEventListener("mousewheel", mouseWheelEvt);
24
Andy E

Comme les solutions ci-dessus ne fonctionnent pas pour moi, voici une autre que je viens de trouver: http://css-tricks.com/snippets/jquery/horz-scroll-with-mouse-wheel/

Exemple: http://digwp.com/archives/horz/

8
madc

Une autre forme:

document.addEventListener('wheel', (e) => {
    document.getElementById('scroll_container').scrollLeft += e.deltaY;
})
0
Heddie Franco