Gazley Posted February 20, 2016 Posted February 20, 2016 Hi there, You've probably seen the effect when a page loads with a header/navbar at a certain height, say 88px, and when the user scrolls down the page a little, the header/navbar animates a reduction in height to say 44px, often with a change of content or logo size. Do any UIKit users know how to achieve this in UIKit? I'm just playing around with UIKit for the first time. Any help/advice, very much appreciated! Thanks!
tpr Posted February 20, 2016 Posted February 20, 2016 You could use the parallax or maybe the sticky component. I usually solve this by checking scroll amount with jQuery and if that exceeds a given amount (px) I add a class to the nav (or the body), and apply new CSS styles to the nav. 1
Gazley Posted February 20, 2016 Author Posted February 20, 2016 Hi @tpr, Thanks for the heads-up. The way you do it (jQuery/scroll) is the way I've done it in the past. I just didn't want to miss out on something that UIKit may have offered "out of the box". I checked the docs but saw nothing and, now I know why! Cheers!
Recommended Posts