Toggle Class with Scrolling in Firefox

Asked

Viewed 38 times

0

Hello! I have the following code that works perfectly in Chrome for some reason, but not in Firefox. Can someone help me decipher why? Since it has already been worked to try to adapt to Firefox. Still unsuccessful.

<script>
var scrollVal = 0;
var mousewheelevt=(/Firefox/i.test(navigator.userAgent))? "DOMMouseScroll" : "mousewheel";
$(document).bind(mousewheelevt, function(e) {
    var offset = -1 * e.originalEvent.wheelDelta;
    if (mousewheelevt == "DOMMouseScroll"){
      offset = e.originalEvent.layerY - e.originalEvent.clientY;
    }
    scrollVal += offset;        
    if (scrollVal < 0) scrollVal = 0;
    console.log(scrollVal);        
    if (scrollVal == 0) {
        $('#projetos').addClass( "bottom");
    }else {
        $('#projetos').removeClass("bottom");
    }    
});
</script>
  • Actually my answer was redundant, I removed so

  • A question, in Firefox, it comes to enter the function?

  • @Ricardopunctual It seems to me that yes, but in a very strange way. If I change this line if (scrollVal == 0) { for if (scrollVal > 1000) {, after rolling 1000px, it does what it should do. It seems to me that in firefox, the scrollVal only increases, while in Chrome it goes up and down, as it should.

  • On the line var offset = -1 * e.originalEvent.wheelDelta; try to use detail in place of wheelDelta. There is a difference in the way browsers take these values.

  • I tried and stopped increasing the scrollVal, consequently did not work.

  • Searching a little to remove the doubt about the compatibility, I found this link, may help you solve: http://www.javascriptkit.com/javatutors/onmousewheel.shtml

  • @Ricardopunctual I’ve even seen this article. The problem is very specific. I don’t know why in Firefox the scrollVal won’t come down...

Show 2 more comments
No answers

Browser other questions tagged

You are not signed in. Login or sign up in order to post.