Contenu HTML seulement des rouleaux de papier avec la barre de défilement, pas de molette de la souris

J'ai un <div> sur ma page avec une hauteur fixe, et overflow-y: scroll; définie de sorte que le contenu va se défiler quand il passe le bord inférieur de la <div>. Rien ne sort de l'ordinaire.

Pour une étrange raison, la molette de la souris ne faites défiler le contenu si le curseur est sur espace vide dans le <div> ou si c'est plus de la barre de défilement. Si le curseur se trouve être sur le texte contenu dans le <div>, la molette de la souris ne fait rien.

Ce qui se passe dans Firefox et Chrome, de sorte qu'il n'est pas juste un caprice d'un moteur de rendu en particulier ou quelque chose.

La <div> en question est superposé à un autre via position: absolute;, donc je suppose que d'une certaine façon la <div> derrière elle interfère avec la molette de la souris de l'événement - mais alors, vous pensez que le problème serait inversé (le <div> faire défiler quand le curseur était sur le texte, et non pas sur l'espace vide).

Quiconque jamais voir quelque chose comme ça avant? Je suis perplexe!

Bizarre, pourriez-vous poster sur jsfiddle?
Je suis en mesure de reproduire le problème: jsfiddle.net/qNS3S/1

OriginalL'auteur daGUY | 2012-05-04

  1. 6

    Eu - c'est parce que j'ai été en utilisant la FancyBox la roulette de la souris plugin. Cela provoque FancyBox pour capturer tous les événements de la molette de la (pour une utilisation avec le défilement à travers les galeries). Depuis que je ne suis pas vraiment à l'aide de toutes les galeries, je n'en ai pas besoin, donc je l'ai pris et immédiatement qui a résolu mon problème.

    dans mon cas, les deux plugins étaient là - molette de la souris plugin et smoothpagescroll

    OriginalL'auteur daGUY

  2. 3

    Essayez d'ajouter z-index: -1; pour le positionnement absolu conteneur DIV CSS.

    Qui travaille dans l'exemple que vous avez posté (ce qui est mon problème exact), mais pas dans mon cas précis. Malheureusement, le conteneur <div> est une lightbox (créé avec FancyBox), donc si je baisse le z-index à -1, il disparaît derrière tout le reste de la page. Hm...
    Du sens. Avez-vous essayé le positionnement de la div scrollable et l'application d'un z-index supérieur à celui de l'absolu div?
    Oui - FancyBox <div> a un z-index de 1101, mais même si je fais le contenu <div>'s z-index plus que cela, il ne fonctionne toujours pas. FancyBox lui-même en fait empêche la page de défilement de la souris lorsque le curseur est placé au-dessus, quel que soit mon <div> être là. Je me demande si je dois modifier quelque chose dans le script lui-même à l'empêcher de capturer la molette de la souris...
    Je pense que vous pourriez avoir à déclarer explicitement position: relative; le contenu de la div dans le but pour elle est la propriété z-index pour prendre effet.

    OriginalL'auteur Quantastical