Добавление класса при попытке скроллинга, как сделать?

Question

[lordprettyflacko]

Здравствуйте, уважаемые друзья. Помогите пожалуйста мне сделать одну вещь. Мне нужно чтобы к блоку прибавлялся класс при попытке скроллинга страницы вверх на 30px. В любом месте на сайте. Заранее спасибо!

Comments

[Сергей delphinpro]

Браузер скроллит на 100px. Так что можете просто следить за событием wheel и если значение отрицательно (-1), значит на 30 пикселей вверх стопудово проскроллили.

Answer 1

[Dave Hornigan]

Первая ссылка из гугла: https://ru.stackoverflow.com/a/653779/283772

Comments

[lordprettyflacko]

Мне нужно чтобы не на определённой точке страницы что-то менялось. А чтобы, например, я нахожусь вообще в футере, начинаю скролить вверх и после скроллинга 30px(например) добавлялся класс к нужному мне блоку

[Dave Hornigan]

lordprettyflacko, на сколько я знаю тебе в любом случае нужно к чему-то привязываться. Из рандомной точки в рандомную событие не повесить

[V Sh.]

lordprettyflacko, гляньте тут: https://learn.javascript.ru/onscroll

[Юпитер Макс]

lordprettyflacko, вам надо зацепиться за эту точку методом offset и потом уже при скролле проверять, если ваш скролл равен значению из offset делать что-то.

Я вот на днях делал. Нужно чтобы кнопка вверх меняла цвет когда попадает на футер.

var $wrHeight = $('.footer').offset().top;
	var $totalrHeight = $wrHeight-100;
	
	$(window).scroll(function () {
        if ($(this).scrollTop() > 1050) {
            $('#to-top').fadeIn();
        } else {
            $('#to-top').fadeOut();
        }
		
		if($(this).scrollTop() > $totalrHeight){
			$('.to-top').addClass('color');
			
		}
		else{
			$('.to-top').removeClass('color');
		}
    });