Javascript event (add style) on height scroll for Chrome, FF, IE

Question

I am trying to trigger an event on scroll at certain height. Specifically yo add a style, and my code works in Chrome, but not in IE. Can anyone assist?

myID = document.getElementById("subnav");
var myScrollFunc2 = function() {
  var y = window.scrollY;
  if (y >= 150) {
    myID.className = "subnav stick";
  } else {
    myID.className = "subnav unstick";
  }
};
window.addEventListener("scroll", myScrollFunc2);

.subnav {
  width: 100%;
  z-index: 100;
  background-color: #ffffff;
}

.stick {
  top: -62px;
  position: fixed !important;
}

.unstick {
  position: relative !important;
}

<div id="subnav">123</div>

`y = document.documentElement.scrollTop + document.body.scrollTop;` — Niet the Dark Absol, Aug 21 '18 at 07:06
Possible duplicate of [IE8 alternative to window.scrollY?](https://stackoverflow.com/questions/16618785/ie8-alternative-to-window-scrolly) — Jaay, Aug 21 '18 at 08:19

score 0 · Answer 1 · answered Aug 21 '18 at 07:06

0

IE doesn't support scrollY.

You can do this instead:

'scrollY' in window ? window.scrollY : document.documentElement.scrollTop

answered Aug 21 '18 at 07:06

We Are All Monica

13,000
8
46
72

score 0 · Answer 2 · edited Aug 21 '18 at 07:23

0

I've came accross an answer searching on SO

var scroll = 
    window.scrollY // Modern Way (Chrome, Firefox)
 || window.pageYOffset // (Modern IE, including IE11)
 || document.documentElement.scrollTop // (Old IE, 6,7,8)

Credits goes to this SO link

edited Aug 21 '18 at 07:23

jonatjano

3,576
1
15
20

answered Aug 21 '18 at 07:07

Jaay

2,103
1
16
34

In that case, it's a duplicate and should be flagged as such. – jhpratt Aug 21 '18 at 07:27

Javascript event (add style) on height scroll for Chrome, FF, IE

2 Answers2