Trying to create a menu that will be attached to the top of the site all the time. Subsequent documents zurb.foundation, but .sticky always behaves as unexpectedly. Or maybe I wonβt get any obvious?
Please check here: http://codepen.io/mister-hansen/pen/wMgrPm
If the site scrolls down and reaches exactly the height of the original viewport , the sticky plugin changes the .sticky element from is-stuck is-at-top to: .is-anchored .is-at-bottom , so .sticky disappears.
Thanks.
UPDATE The first part of the documentation: foundation.zurb.com/sites/docs/sticky.html explains the described behavior. Due to the default body {height: 100%} css, the body is interpreted exactly with max. viewing window height.
So, in my case, the solution: a) redefines the height of the body from the car. But better b) Just avoid using sticky functionality for the intended fixed header.
source share