jQuery scrolling div top

Question

I've got a div that scrolls with the page after it clears the header section. Seems to work fine, but when scrolling back to the top, it won't go back to the exact spot that it started at when he page loaded.

Script:

$(document).ready(function() { $(window).scroll(function() { if ($(window).scrollTop() > 266) { var $myDiv = $("#scrollingNavigation"); $myDiv.stop(); $myDiv.animate({ marginTop: ($(window).scrollTop()) - 266 }); } else { ($(window).scrollTop() - 266); } }); });

HTML:

<div id="scrollingNavigation">My content and image here</div>

Example: http://jsfiddle.net/masada/zZgcG/4/

Try scrolling the window slowly, and it will leave only about 8-10px from the top. Scroll fast and the div will rest back at the top at all different kinds of space from the top. Rather confusing.

hemkaran_raghav · Accepted Answer · 2015-04-21 09:24:26Z

1

a little change to your code..

$(document).ready(function() { $(window).scroll(function() { var $myDiv = $("#scrollingNavigation"); if ($(window).scrollTop() > 50) { $myDiv.stop(); $myDiv.animate({ marginTop: ($(window).scrollTop()) + 50 }); } else { $myDiv.stop(); $myDiv.css({ marginTop: 0 }); } }); });

please find working demo here "http://jsfiddle.net/zZgcG/10/".

edited Apr 21, 2015 at 9:24

hemkaran_raghav

1,36611 silver badges25 bronze badges

answered Jan 25, 2013 at 20:14

ashwinik001

5,2484 gold badges36 silver badges41 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

MPR Over a year ago

Thanks, but this kills the scrolling altogether. Your example doesn't show any scrolling for the div, regardless of how far one scrolls down.

ashwinik001 Over a year ago

Right it did not work before as i mistakenly had put - in stead of +. Now have edited the code and it seems working fine. Please check at the updated link.

MPR Over a year ago

Ashwini, it now works fine. Thank you VERY MUCH for your help in this matter!

ashwinik001 Over a year ago

@MPR most welcome and you can select it as the correct answer so that others may also get benefited from the same.

Collectives™ on Stack Overflow

jQuery scrolling div top

1 Answer 1

4 Comments

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Related