Zurb Foundation 6 sticky switch status at end of viewport height ".is-anchored .is-at-bottom"

Question

Trying to create a menu that is sticked to the top of site whole time. Followed docs of zurb.foundation, but .sticky behaves always the same unexpected way. Or maybe I don't get some obvious?

Please check for reconstruction here: http://codepen.io/mister-hansen/pen/wMgrPm

If site is scrolled down, and hit the exactly height of initial viewport, sticky plugin is changing the element .sticky from is-stuck is-at-top to: .is-anchored .is-at-bottom so .sticky disappear.

Thank you.

UPDATE The first part from documentation: foundation.zurb.com/sites/docs/sticky.html explains the described behaviour. Because of default body { height: 100% } css, the body is interpreted exactly with max. height of viewport.

So in my case solution is a) override height of body with auto. But better b) Just avoid to use the sticky functionality for intended fixed header.

Answer 1

I set the data-check-every plugin option to 0 to recalc every scroll event. Now the viewport's height is calculated again when content is loaded dynamically, such as when infinite scroll is used.