IE11 problem

JavaScript
1

I have this script that works perfectly in all browsers:

var position = 0;
window.addEventListener('scroll', function(){
console.log(this.pageYOffset);
   if(this.pageYOffset < 1){
   document.getElementById('navbar').classList.remove('background');
   } else {
  	 document.getElementById('navbar').classList.add('background');
   }
   if(this.pageYOffset > 200){
   document.getElementById('navbar').classList.add('down');
   } else {
     document.getElementById('navbar').classList.remove('down');
   } 
   if(this.pageYOffset > 200 && this.pageYOffset > position){
   document.getElementById('navbar').classList.add('hidden');
   } else {
  	 document.getElementById('navbar').classList.remove('hidden');
  }  
position = this.pageYOffset;
})

The functioning is:

  1. When the page is loaded without any scroll or less than 200px, the navbar at the header is displayed with a background by adding the class “background”.

  2. If scroll down more than 200px, the navbar hiddes by adding the class “hidden”.

  3. At any point of the page below 200px, if scroll up, the navbar shows again by removing the “hidden” class.

It works perfectly. But now I see that in IE11, the class “hidden” is added and then removed at any point of the page for some reason.

Do you know why?

2

I would suspect that the else() is being triggered, possibly by the function being called twice at the stop point of the scroll.
Stick some console.log commands in there to debug, figure out what the function is doing.

3

Pure guess, but it wouldn’t hurt to add brackets

(this.pageYOffset > 200) && (this.pageYOffset > position)

4

The console shows no errors at all, and it is not a problem of brackets.

I have found out that the problem is related to the kind of scroll used; if I use the scroll at the right with the pointer, there is no problem; if I use the mouse wheel, the script adds and removed the hidden class.

IE11 bug??? Do you know if there is any solution?

5

Code works as expected for me in IE 11.356.8362

6

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.