nanam Posted September 4, 2019 Share Posted September 4, 2019 Hello, can someone please help with some code that would make the navigation bar and white background sticky on scroll? https://www.hellobrella.com Thank you! Link to comment
tuanphan Posted September 5, 2019 Share Posted September 5, 2019 @asjeffer Did you solve problem? Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
nanam Posted September 5, 2019 Author Share Posted September 5, 2019 @tuanphan thank you for checking! I tried the following code, but you can see that the bar appears to be floating rather than fixed to the top of the screen...there is a gap above the nav bar/header through which you can see the content underneath as you scroll...do you have a fix for this or new code all together? Thanks again! .Header-inner { z-index: 9999; width: 100%; } .Header{ z-index: 9998; position: fixed; width: 100%; } @media screen and (max-width: 3000px) { .Index-page--has-image .Index-page-content { margin-top:104px !important; } } @media screen and (max-width: 500px) { .Index-page--has-image .Index-page-content { margin-top:0px !important; } } Link to comment
tuanphan Posted September 6, 2019 Share Posted September 6, 2019 @asjeffer you can add top: -2px .Header { z-index: 9998; position: fixed; width: 100%; top: -2px; } Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
nanam Posted September 6, 2019 Author Share Posted September 6, 2019 That fixed it @tuanphan thank you so much! Link to comment
mariella Posted December 12, 2019 Share Posted December 12, 2019 @tuanphan can you share the code for your fix above? I'm also trying to accomplish a sticky on scroll effect for my primary nav using maple. Link to comment
tuanphan Posted December 12, 2019 Share Posted December 12, 2019 26 minutes ago, mariella said: @tuanphan can you share the code for your fix above? I'm also trying to accomplish a sticky on scroll effect for my primary nav using maple. Can you share link to your site? Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
Recommended Posts
Archived
This topic is now archived and is closed to further replies.