Onmousewheel事件和Mozilla Firefox [英] Onmousewheel event and Mozilla Firefox

问题描述

我试图使元素更改为不透明，具体取决于滚动滚动的方向（如果滚轮上不透明度达到1.0，否则为0.3），所以我附加了一个事件onmousewheel =改变（事件）;到HTML体，并在JS做了以下：


$ b $ pre $函数transp（e）{
var元素= document.getElementById（elem）; （e.wheelDelta> = 120）{
element.classList.remove（'scroll-minus'）;

if
element.classList.add（'scroll-plus'）;
}
else if（e.wheelDelta< = -120）{
element.classList.add（'scroll-minus'）;
element.classList.remove（'scroll-plus'）;




$ b我不会打扰发布CSS3信息， CSS3的东西像不透明：0.2 / 1.0，过渡：2s ... CSS是不是一个问题


这对谷歌浏览器和IE浏览器完美的作品，但Firefox不缝，听取onmousewheel事件。还有其他类似的事件可以听吗？它是如何使用的？

解决方案

mousewheel 事件是非标准的，在Firefox中不受支持。您可以使用 wheel 事件而不是标准化，尽管还没有完全支持。所以如果你想要一个跨浏览器的解决方案，你可能需要混合这些事件，或者使用 scroll event 。

I'm trying to make an element change it's opacity depending on the direction the way the scrollwheel is being scrolled (if scrollwheel is going "up" opacity goes to 1.0, otherwise 0.3), so I attached an event onmousewheel="change(event);" to the html body and did the following in JS:

function transp(e){
    var element = document.getElementById("elem");

    if(e.wheelDelta >= 120){
        element.classList.remove('scroll-minus');
        element.classList.add('scroll-plus');
    }
    else if(e.wheelDelta <= -120){
        element.classList.add('scroll-minus');
        element.classList.remove('scroll-plus');
    }
}

I won't bother posting CSS3 info, it's just CSS3 stuff like opacity: 0.2/1.0, transition: 2s... CSS isn't a problem

This works perfectly on google chrome and IE, but firefox doesn't seam to listen to the onmousewheel event. Is there any other similar event that it might listen to? How is it used?

解决方案

The mousewheel event is non-standard, and not supported in Firefox. You can use the wheel event instead which is standardized albeit not completely supported yet. So if you want a cross-browser solution, you will probably have to mix these events, or make use of the scroll event instead.

这篇关于Onmousewheel事件和Mozilla Firefox的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！