Gazley Posted February 20, 2016 Share 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! Link to comment Share on other sites More sharing options...
tpr Posted February 20, 2016 Share 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 Link to comment Share on other sites More sharing options...
Gazley Posted February 20, 2016 Author Share 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! Link to comment Share on other sites More sharing options...
Recommended Posts