I tried to use the following function in order to set the div's position to 100 px from top after scrolling 100 px.

<script src=".js"></script>
<script type="text/javascript">
$(window).scroll(function(){
    $("#header").css("top",Math.max(0,100-$(this).scrollTop()));
});
</script>
<div class="header"  style="position:fixed;top:100px;background-color:red">something</div>

it is not working(the div stick to it's fixed position). it seems that the function is not relating to the div. what is my problem ?

I tried to use the following function in order to set the div's position to 100 px from top after scrolling 100 px.

<script src="http://code.jquery./jquery-latest.js"></script>
<script type="text/javascript">
$(window).scroll(function(){
    $("#header").css("top",Math.max(0,100-$(this).scrollTop()));
});
</script>
<div class="header"  style="position:fixed;top:100px;background-color:red">something</div>

it is not working(the div stick to it's fixed position). it seems that the function is not relating to the div. what is my problem ?

• javascript
• jquery

Share Improve this question Follow asked Jul 5, 2012 at 9:09 user1481850user1481850 24833 gold badges1313 silver badges2424 bronze badges

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 3

Your problem ist that your div has the class header, not the id. Try <div id="header" style="position:fixed;top:100px;background-color:red">something</div>

$(document).ready(function(){
    $('.header').scroll(function(){
        $(this).css("top",Math.max(0,100-$(this).scrollTop()));
    });
});