[kkkirilll]

Понимаю, что это уже заезженная фраза, но все же помогите чайнику, пожалуйста
Есть такой код. Он двигает элемент хедер в зависимости от прокрутки страницы.
changeHeaderOn сообщает в пикселях, когда нужно включить класс.
Мне нужно, чтобы changeHeaderOn была переменной при разной ширине браузера, например:
при ( winDow.width() < 992 ) changeHeaderOn = 150 пикселей,
а при ( winDow.width() >= 992 ) changeHeaderOn = 50 пикселей.
Кажется, что понимаю, чего хочу, а собрать как надо не могу.

(function() {

		var docElem = document.documentElement,
			didScroll = false,
			changeHeaderOn = 50;
			document.querySelector( 'header' );
		function init() {
			window.addEventListener( 'scroll', function() {
				if( !didScroll ) {
					didScroll = true;
					setTimeout( scrollPage, 100 );
				}
			}, false );
		}
		
		function scrollPage() {
			var sy = scrollY();
			if ( sy >= changeHeaderOn ) {
				$( 'header' ).addClass('active');
			}
			else {
				$( 'header' ).removeClass('active');
			}
			didScroll = false;
		}
		
		function scrollY() {
			return window.pageYOffset || docElem.scrollTop;
		}
		
		init();
		
	})();