Comment empêcher le défilement de la souris en dehors de l'élément planétaire?

Question

J'ai un div qui est réglé pour déborder: scroll ;. Je reçois des barres de défilement, c'est ce que je veux. Cependant, lorsque vous faites défiler la div avec la molette de la souris, elle défile le reste de la page lorsqu'elle atteint le haut ou le bas du contenu de la div.

Comment puis-je faire défiler uniquement la div ou la page entière en fonction de ce qui est plané?

Answer 1

D'abord je ne pense pas que vous pouvez remplacer l'événement de défilement. Alors voici ce que je ferais. Je ne sais pas jquery mais voici un javascript direct.

document.getElementById('scrollDiv').onmouseover=function(){ 
    document.getElementByTagName('body')[0].style.overflow='hidden'; 
} 
document.getElementById('scrollDiv').onmouseout=function(){ 
    document.getElementByTagName('body')[0].style.overflow=''; 
} 

De toute évidence, vous pouvez régler un peu, mais c'est l'idée de base. Aussi, si vous avez besoin de vous pourriez faire d'autres cas de test. Comme si le div avait le focus, alors faites la même chose. Cela dépend de votre configuration.

Answer 2

Dans ce cas, je pense que vous devrez remplacer l'événement onscroll par défaut pour le corps. Dans votre gestionnaire, vous devrez faire défiler manuellement le contenu de la div.

Answer 3

Vous pouvez tester la position de la souris et annuler les événements de défilement pour le document si la souris est dans les limites de la div.