≡
Products
▼
Support
▼
Company
▼
Forum
Ambiera Forum
Discussions, Help and Support.
Create a new account
,
Search
, or Login:
Create reply in
Fixed / Sticky Header
Posted by:
(you are not logged in)
Enter the missing letter in: "Internation?l"
(you are not logged in)
Text:
[quote][b][/b] wrote: Hey, after three days, I figured out a reasonably easy way to do these sticky menus. My version matches the request in this thread that the navigation menu begins under the header, and scrolls up with it, and then stops when it reaches the top of the page and is fixed there until the user scrolls back to see the header re-appear. If I can be so bold as to think I have something valuable to offer, let me explain how I accomplished this for my navigation menu. First, I edited the HTML of the navigation menu. I added the additional attribute of: class = "sticky" Then in the main html of my masterpage.html, I also added in the additional CSS of: div.sticky { position: -webkit-sticky !important; position: sticky !important; z-index: 3000 !important; top: 0; } That's really all you need to add in the way of custom code to get this to work! Now, the caveats (aren't there ALWAY caveats?) The navigation menu CANNOT be inside any other container. It seems like it will inherit the CSS positioning of the other container. I have had no luck defining the container as sticky and hoping the menu inside it would stay with the container, or even creating a second div.sticky2 with a higher z-index. Perhaps someone much wiser than myself in the ways of CSS could shed some light on this? So anyway, my policy of keeping my whole page inside a container right at the start had to change. Now the header is inside a container, then the navigation menu directly on the masterpage, and then a content container, and finally my footer container. The knock-on effect of this for me personally is that it wrecks my intention to have a navigation menu that is centred on the page. I'm still studying this. As I've said elsewhere, the navigation menu seems to ALWAYS left justify, and now that I cannot put it into another container and centre that, I'm a bit stumped. Peace out.[/quote]
Possible Codes
Feature
Code
Link
[url] www.example.com [/url]
Bold
[b]bold text[/b]
Image
[img]http://www.example.com/image.jpg[/img]
Quote
[quote]quoted text[/quote]
Code
[code]source code[/code]
Emoticons
Copyright© Ambiera e.U. all rights reserved.
Privacy Policy | Terms and Conditions | Imprint | Contact