Как изменить цвет заголовка, когда полоса прокрутки переместилась или был нажат элемент меню?

Question

Как изменить цвет заголовка, когда полоса прокрутки переместилась или был нажат элемент меню?

0

Я работаю над веб-сайтом одной страницы, и я уже пользуюсь шпионским прокруткой, чтобы моя веб-страница могла прокручиваться непосредственно до идентификатора div при щелчке пункта меню. Я хочу сделать этот шаг дальше и фактически изменить цвет заголовка. Теперь заголовок представляет собой прозрачный цвет, поэтому я хочу изменить его на сплошной цвет, как только будет перемещаться полоса прокрутки или элемент меню, а затем измените его, когда он находится в верхней части страницы.

Как можно это сделать с JQuery? Я видел сайты, делающие это, хотя я не могу найти пример. Может ли кто-нибудь помочь мне?

user1632018 02 март 2014, в 23:43

Источник

0

Можете показать пример сайта?
Idris 02 март 2014, в 22:47

Теги:

jquery

html

css

html5

css3

3 ответа

Ещё вопросы

jmore009 · Answer 1 · 2014-03-02T20-36-00.000Z

вы можете выполнить это с помощью функции прокрутки jquery и некоторых css3-переходов (если вы хотите, чтобы цвет исчезал)

$(window).scroll(function(){
  if($(window).scrollTop() > 0){
    $(".header").addClass("scroll");  
  }else{
    $(".header").removeClass("scroll");  
  };
});

JSFIDDLE

Cameron · Answer 2 · 2014-03-02T20-49-00.000Z

В зависимости от ваших вариантов использования и того, какие функции вы ищете, большой плагин jQuery - это путевые точки: http://imakewebthings.com/jquery-waypoints/

Nick · Answer 3 · 2014-03-02T20-19-00.000Z

У вас есть примеры? Не могли бы вы это поиграть?

http://jsfiddle.net/RG3m7/ - Что-то вроде этого может быть тем, что вам нужно. Если это так, очень просто.

$(function() {                  
  $(".content").click(function() { 
    $(this).addClass("active");   
  });
});

Обновлено - это приведет к удалению класса при выборе другого. Надеюсь, это помогает? Извините, если мне не хватает :)

$(function() {
  $(".content").click(function() {
    $(this).addClass("active"); 
    $(".content.active").removeClass("active");
    $(this).addClass("active");
  });
});

NEW - http://jsfiddle.net/RG3m7/1/