Jquery изменение цвета текста фиксированного элемента с опорными точками

Я пытаюсь изменить цвет текста в фиксированном заголовке, в тот момент, когда он прокручивается над определенным div. У меня нет почти никаких знаний jQuery, но они объединили метод с использованием определенного измерения пикселей, который при прокрутке изменит цвет текста. Здесь текущий код jQuery:

$(document).ready (function () {
 $(window).scroll (function () {
 var sT = $(this).scrollTop();
 if (sT >= 400) {
 $('.header').addClass('change')
 }else {
 $('.header').removeClass('change')
 }
 });
});

Я действительно нуждаюсь в том, чтобы изменения происходили в точке привязки, так что они занимали разные размеры устройств. Надеюсь, что это имеет смысл?

Вот то, что я работаю в кодефене: http://codepen.io/danburrows/pen/ChFxi

надеюсь кто-то может помочь :)

2 ответа

Вам нужно будет сравнить положение div, где вы хотите изменить цвет текста на позицию полосы прокрутки...

Вот код: http://codepen.io/anon/pen/sgmaJ

Вам не нужно менять большую часть кода JQuery.

Просто измените, if выражение на это:

if (sT - $('.bottom').position().top > 0) {
 $('.header').addClass('change')
}else {
 $('.header').removeClass('change')
}


Вы можете связаться с ним с помощью этого кода:

$(document).ready (function () {
 $(window).scroll (function () {
 var sT = $(this).scrollTop();
 if (sT >= $('.bottom').offset().top) {
 $('.header').addClass('change')
 }else {
 $('.header').removeClass('change')
 }
 });
});

Вам нужно искать смещение объекта, который вы хотите.

licensed under cc by-sa 3.0 with attribution.