2015-08-09 6 views
1

У меня есть этот код, и он не изменяет цвет div. Я попробовал много скриптов из stackoverflow, но не могу найти тот, который работает.Изменение цвета DIV при прокрутке вниз

$(window).scroll(function(event) { 
 
    var scroll = $(window).scrollTop(); 
 
    if (scroll > 20) { 
 
    document.getElementById("scroller").style.background = "#3C3F47"; 
 
    } 
 
});
#scroller { 
 
    height: 80px; 
 
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; // ie8 
 
    filter: alpha(opacity=50); // ie5-7 
 
    -moz-opacity: 0.5;   // netscape 
 
    -khtml-opacity: 0.5;  // Safari 1.x 
 
    opacity: 0.5;    // Good browsers 
 
    border-bottom: 0px; 
 
}
<div id="scroller" class="navbar-fixed-top scroller"> 
 
    asd 
 
</div>

+1

у вас есть scrollTop = 0 всегда, так как вы не имеете полосу прокрутки. Попробуйте высоту CSS: 200% на теле, чтобы иметь scrollBar, а затем прокрутите – joyBlanks

+1

, ваш код отлично работает, я думаю, ваша проблема в том, что вы не использовали '$ (document) .ready()' в начале кода jquery –

+0

Фрагмент будет работать, если бы у него была полоса прокрутки, и если бы он задал jQuery. –

ответ

0

$ (окно) работает при е JQuery загружается!

Кажется, вы не загружать любой Jquery файлу

1.Download JQuery из этого URL и загрузить его на своей странице!

http://blog.jquery.com/2013/01/15/jquery-1-9-final-jquery-2-0-beta-migrate-final-released/

2.Do так:

$(function(){ 
$(window).scroll(function(event) { 
    var scroll = $(window).scrollTop(); 
    if (scroll > 20) { 
    document.getElementById("scroller").style.background = "#3C3F47"; 
    } 
}); 
}) 
Смежные вопросы