javascript - Add class when Scroll Up the page -


trying add class .darkheader .nav when scroll page. means no class add when scrolling down, class add while scroll page after remove when scrolling down.

jquery:

$(window).scroll(function() {     var scroll = $(window).scrolldown();      if (scroll >= 100) {         $(".nav").addclass("darkheader");     } else {         $(".nav").removeclass("darkheader");     } }); 

html:

<div class="nav"> sticky top navigation bar </div> <div class="wrap"> <h3>some filler text</h3> <p>bacon ipsum dolor sit amet mollit ball tip occaecat brisket cupidatat meatball capicola. capicola rump turducken, elit shankle cupidatat pastrami duis fatback. sint occaecat kielbasa labore pastrami corned beef. sunt swine bacon, fugiat dolor aute anim jerky nostrud et venison shankle consectetur boudin landjaeger. pork chop sed turkey aute, duis corned beef pariatur short loin proident culpa. capicola filet mignon fugiat corned beef shank ea, commodo doner adipisicing eu salami. doner laboris pariatur beef ribs non id. andouille eu meatball consectetur ham hock. ea dolore cillum cow pork loin aliquip leberkas id est corned beef dolore t-bone. in salami jerky cupidatat et.</p> </div> 

fiddle: http://jsfiddle.net/oycv4hba/1/

but it's not working. way add class when scroll page? (only jquery)

first : xwhylikethis said there no scrolldown

use this

// script $(window).on('scroll',function() {         var scroll = $(window).scrolltop();      if (scroll >= 100) {         $(".nav").addclass("darkheader");     } else {         $(".nav").removeclass("darkheader");     } }); 

2nd have bad arrangement in css should add !important

.darkheader {     background-color: black !important;      position: fixed; } 

or add .darkheader class after .nav class

demo here


Comments

Popular posts from this blog

angularjs - ADAL JS Angular- WebAPI add a new role claim to the token -

php - CakePHP HttpSockets send array of paramms -

node.js - Using Node without global install -