смена стилей css при прокрутке, не работает в ie , safari
 

Здравствуйте! в js почти ничего не знаю, нашел код на каком то сайте и методом тыка используя ограниченные знания изменил его. Работает в хроме и фаерфоксе, ие и сафари отказывается работать. судя по итогам поиска проблемы наткнулся на факт, отсутствует поддержка участков кода. как и что исправить не понимаю, прошу помощи...:help:

необходимое действие:
изменение свойства css "z-index" в зависимости от позиции области просмотра

код:
var avatarElem = document.getElementById('range');
var avatarSourceBottom = avatarElem.getBoundingClientRect().bottom + window.pageYOffset;

window.onscroll = function() {
if ( window.pageYOffset < avatarSourceBottom) {
avatarElem.classList.remove('zindex');
} else if (window.pageYOffset > avatarSourceBottom) {
avatarElem.classList.add('zindex');
}
};

Ну а после

avatarElem.classList.add('zindex');

?

нужно значение назначить

avatarElem.style.zIndex = ...;

Кстати, а это

avatarElem.classList.add('zindex');

и это

avatarElem.classList.remove('zindex');

работает? Что-то сомневаюсь...

https://learn.javascript.ru/metrics-window#page-scroll