Jump to content

Archived

This topic is now archived and is closed to further replies.

mnagillum

adding a sticky element below menu

Recommended Posts

mnagillum

Using the Element feature, we added a thin rule below the menu, which was built using meganav. We would like this rule to remain along with the menu when the user scrolls up. Could you make this easier by adding a sticky option to Element? Or advise us on how to do this in another way?

Thanks!

menu-with-rule.png

menu-on-scroll.png

Share this post


Link to post
Share on other sites
Andrew

Use CSS, when the meganav goes sticky it gets a class to that effect. Not sure exactly what you're going for but im sure its doable with a css border or something.

Share this post


Link to post
Share on other sites
mnagillum
19 hours ago, Andrew said:

Use CSS, when the meganav goes sticky it gets a class to that effect. Not sure exactly what you're going for but im sure its doable with a css border or something.

We'll try this. Thanks.

Share this post


Link to post
Share on other sites

  • Similar Content

    • glyph.marketing
      By glyph.marketing+
      Hello, I am having a problem similar to that experienced by Michael Kummer here. We have pages that show this automatic scrolling issue (examples here and here) and it is sufficiently annoying that we have seen customers bounce while trying to convert. Strangely, it only happens at specific resolutions, so it can be difficult to reproduce. In general we can only consistently reproduce it on a 4k resolution with a browser width between 1517 and 1536px. 
      Thanks to Michael Kummer's help we were able to set the overflow-anchor property to none in the entire body, which fixed the issue as far as we can tell, but also obviously disabled scroll anchoring for the whole site. I tried applying it to the specific element that looked like it was being reloaded, which was the PL Meganav extension, but that was unsuccessful. 
      Can anyone help us figure out which element or ID we can apply this property to, so that we can fix the scrolling issue but not disable scroll anchoring for the entire site?
      Thank you - 
      Glyph Language Services
    • Liv Kundalini
      By Liv Kundalini+
      Hi -
      Pulling my hair out over here, and would love an assist!
      Site I am building, http://www.livkundalini.com/home, has a problem with the submenu items in the nav not appearing. 
      If anyone wants to see what the Nav should look like, feel free to look in the footer on the left hand side.
      Have tried disabling Pagelines and using the twentyseventeen theme, but problem persists.
      Saw this error (pasted at the bottom of this post) displaying in the inspector, and saw discussion of Jetpack potentially being a culprit. Disabled Jetpack, but the problem persists.
      Had the hosting company even flush the server-side cache, but no avail.
      Any thoughts? Please? It's the only thing keeping me from launching this site!
      Many Thanks,
      Todd
       
      WebSocket connection to 'wss://public-api.wordpress.com/pinghub/wpcom/me/newest-note-data' failed: Error during WebSocket handshake: Unexpected response code: 403   O @ (index):7
    • mtaus
      By mtaus+
      I'm using MegaNav on this site and the menu items and logo are "sticky" (which I selected), but the background scrolls. 

    • russe-intensif
      By russe-intensif+
      Hi team,
      checking my site today, i'm surprised to see my MegaNav all in bottom of the pages, while it's in header.
      After getting to change it in couple of pages onto Template part (too time consuming !), i'm desperate and ask you for help :-)
      apprendre-le-russe-avec-ania.fr
      Thank you in advance !

    • abeedle
      By abeedle+
      It appears that within the default settings for MegaNav menu items are slightly opaque when they are not selected or hovered over. Then on the selected page and on hover of the menu item opacity goes to 1. It's not a big deal in most cases but we are including a button on a client's menu and the white text just doesn't stand out as well unless you are on the page itself and the opacity has changed to 1.
      My question is whether there is a way to essentially flip the default settings so that when a menu item is not selected/hovered over the opacity is 1 and when the page is selected/on hover the opacity is slightly less than 1.
      I assume the fix would be by using custom CSS and we have tried a few different methods of attempting to target the menu opacity without success.
      Any help would be greatly appreciated! Thanks!
×