Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to add css style if user scroll page over 112px

I would like to know how is possible to assign a css rule to an element only if current scroll position is greater than 112px..

I've tried this but it doesn't work:

    <script type="text/javascript">
$window.scrollTop(function(){ 

var a = 112;
var pos = $window.scrollTop();
if(pos > a) {
    $("menu").css({
                position: 'fixed'
            });
}
else {
    $("menu").css({
                position: 'absolute',
                top:'600px'
            });
}
});
</script>
like image 304
Luca Frank Guarini Avatar asked Feb 19 '12 15:02

Luca Frank Guarini


1 Answers

Try using below code

<script type="text/javascript">
$(window).scroll(function(){ 

var a = 112;
var pos = $(window).scrollTop();
if(pos > a) {
    $("menu").css({
                position: 'fixed'
            });
}
else {
    $("menu").css({
                position: 'absolute',
                top:'600px'
            });
}
});
</script>
  • $window.scrollTop changed to $(window).scroll
  • $window changed to $(window)
like image 50
Shameem Avatar answered Sep 18 '22 12:09

Shameem