J'ai une page Web avec DIV défilable dessus. Au-dessus de Scrollabing Div, j'ai absolument positionné Div qui chevauche la moitié de Div défilable.
Lorsque je pose le curseur de la souris sur le défilement, je peux faire défiler la roue de la souris. Mais lorsque je déplace le curseur sur le curseur sur DIV, la molette de la souris arrête de défiler de la molette que DIV (et c'est un comportement correct car l'absolu positionné DIV n'est pas à l'intérieur de DIV défilable). P>
strong> Question: strong> Comment Evénement de défilement de passation ou d'expédition reçue par Absolute positionné Div à ce sous-jacent défilé Div pour rendre cet absolu positionné Div 'Transparent' pour les événements de la molette de la souris. P>
Je pourrais le faire travailler en chrome, mais pas dans IE et Firefox . Comment réécrire ce code pour le faire fonctionner dans IE et Firefox? strong> p> Voir exemple ici:
http://jsfiddle.net/hac4k/5 p> Dans Chrome et Firefox propriété CSS impressionnant est pris en charge:. pointer-events: none code> p> < / p>
5 Réponses :
ressemble à un problème connu avec jQuery: originaleVent non pris en charge dans IE P>
Ici jsfiddle.net/hac4k/5 est mis à jour la version sans originaleVent
La réponse courte: vous utilisez des paramètres incorrects de initwheelevent code> dans La démo dans cas d'utilisation Internet Explorer. La méthode doit avoir 16 paramètres décrits dans La documentation . YO Utilisez actuellement seulement 11 paramètres les mêmes qui ont initwebkitwheelevent code>, mais la signification de tous les paramètres de initwheelevent code> est absolument une autre. Vous devez corriger les paramètres de initwheelevent code>. P>
Voici la version modifiée JSFIDDLE.net/hac4k/5 avec des paramètres de cette documentation et sans utilisation originale. J'ai essayé de nombreux ensembles de paramètres différents et sans succès.
Je me rends compte que ce n'est pas exactement ce que vous recherchez, mais au moins dans Chrome, IE7 + et Firefox 3,5+, cela fait ce que vous demandez - faites défiler la DIV sous-jacente lorsque la div les recouverte de DIV reçoit des événements de défilement:
http://jsfiddle.net/b9chris/ym3qs/ p>
Ça fait Donc, simplement parce que la DIV qui se chevaucheux est un enfant de la Div, il se chevauche - pas de jQuery qui passe sur des événements de la souris (bien qu'il écoutant de faire défiler pour assurer que la div se chevauchant reste là où elle doit être). P>
Mise en œuvre Ce type de solution de contournement dans JQGRID peut nécessiter de corrompre un peu de code là-bas, cependant. p>
html: p> CSS: p> (function() {
$('#under').on('scroll', function() {
$('#over').css('top', $(this).scrollTop() + 100);
});
})();
Utilisez RetargetMousesCroll code> (conteneur de chevauchement, conteneur de défilement) < / code>. p>
Cette bibliothèque ne fonctionne que pour la cible code> fenêtre code>, pas pour HTMelement. Mais après l'édition, il devient travailler. Ce n'est pas une véritable redirection mais proche de celle-ci - au moins cette bibliothèque calcule correctement la quantité de changement de défilement dans les pixes - il n'y a donc aucune différence d'apparence entre les parties de gauche et droite.
Au fait, les modifications sont les suivantes: à la ligne 34, remplacez la ciblewindow.scrollby (0, le scrollocount); avec {if (ciblewindow.scrollby) ciblewindow.scrollby (0, scrollocount); sinon si (Targewindow.scrollbylines) Targetwindow.scrollbylines (ScrollonsLoundlines); sinon ciblewindow.scrolltop = ciblewindow.scrolltop + scrollocount; }
Merci, je vais regarder en ajoutant cela à la bibliothèque.
Voici la solution 2019 pour le conteneur superposé pour obtenir l'événement de roue: de cette façon, l'élément chevauché strong> obtient l'événement de la roue à partir du se chevauchant fort > élément appelé .overlap code>. p> p>