javascript - How to find scrollTop after DOM modification -




i working on mobile application, use ajax load pages based on framework7, since i'm loading pages & content dynamically, function supposed change header's color not working anymore.

here fonction :

function scroller(){      var target=$(window).scrolltop();     console.log(target);      if(target>=150){         $('.navbar').css({'background-color':'rgba(191, 141, 87, 1)', 'box-shadow':'0px 0px 5px black', 'transition': 'all 1s ease'});     }     else{         $('.navbar').css({'background-color':'rgba(191, 141, 87, 0)','box-shadow':'none'});     }    }    

the console displaying 0 var target, , guess because modify dom , add content not here @ instanciation of page.

how can make function work ? thanks

edit :

i call function in body :

<body onscroll="scroller();"> 

see below example hope want this...

fiddle

function scroller(){       var target=$(window).scrolltop();      console.log(target);        if(target>=150){          $('.navbar').css({'background-color':'rgba(191, 141, 87, 1)', 'box-shadow':'0px 0px 5px black', 'transition': 'all 1s ease'});      }      else{          $('.navbar').css({'background-color':'gold','box-shadow':'none'});      }     }      $(document).scroll(function(){   	scroller();   })
.navbar{    position:fixed;top:0;background-color: gold;width:100%;  }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>  <div class="navbar">    <p>      header...    </p>  </div>  <ul>    <li></li>    <li></li>    <li></li>    <li></li>    <li></li>    <li></li>    <li></li>    <li></li>    <li></li>    <li></li>    <li></li>    <li></li>    <li></li>    <li></li>     <li></li>    <li></li>    <li></li>    <li></li>    <li></li>    <li></li>    <li></li>    <li></li>    <li></li>    <li></li>    <li></li>    <li></li>    <li></li>    <li></li>    <li></li>    <li></li>    <li></li>    <li></li>    <li></li>    <li></li>    <li></li>    <li></li>    <li></li>    <li></li>    <li></li>  </ul>





wiki

Comments

Popular posts from this blog

Asterisk AGI Python Script to Dialplan does not work -

python - Read npy file directly from S3 StreamingBody -

kotlin - Out-projected type in generic interface prohibits the use of metod with generic parameter -