This is driving me crazy, and I don’t understand why this happens. Try the page at: http://test.stoutbowman.com/blog-index-new.html by loading it, scrolling down a screen-full or two to confirm that the top menu sticks, then reload the page. Now, after a screen-full or two, the sticky menu scrolls up and off the window. If you clear your browser cache and reload the page, the top menu becomes sticky again, until you once again reload it.
On the Sticky doc page, there is this statement for the _calc method: " Called on every
scroll event and on
_init fires functions based on booleans and cached values". Could this be the problem?
I have tried everything I can think of: executing $(document).foundation() only after the js that fills the page runs, turning off page caching in my .htaccess file for the page, and a whole host of other things. Note that this happens only after the page has been reloaded after the cache is cleared, although I get the same result if I clear cache, load the page, don’t scroll it, and then load it again. If I clear cache, reload the page, navigate to another page using the menu, and then use the browser’s back button to go back to the page, I get the same unsticking.
Any insight into this will be greatly appreciated.