Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • December 18, 2017 at 4:06 am #889888
    tonyska

    Hello!

    I am creating a mega menu on my site. I would like to understand the classes and selectors for the mega menu so I can style the sub-items, and to control its drop-down visibility so I can leave it “open” while I edit it. Chrome inspector won’t allow me to inspect the menu while it’s open, which is frustrating…:)

    So my questions are:
    1. How can I leave the drop-down menu open?
    2. Can you please list for me the best selectors to work with?

    Maybe in a future Enfold update you can publish such a list of selectors in the Enfold documentation? It would be an amazing reference tool. Thank you!

    I have created a user for you in my site so you can see my menu layout, and I have enclosed a link to what I am trying to create.

    I would like to have the 28pt/32pt nested under the product names. I think the best thing to do would be to create a non-clickable “description” menu item under there, yes? Also, I would love to remove the list style arrows.

    If you have suggestions, I would love to hear them! Again, I just need the selectors and classes for the menu, I will figure out the best way to play with them to get the right look. My image is a very rough draft…:)

    If you have any questions let me know. Thank you!

    • This topic was modified 7 years ago by tonyska.
    December 20, 2017 at 8:37 pm #890921
    tonyska

    If it’s helpful to get more specific, I’d like to play around with the opacity of the mega menu overlay, and create a rule under the heading to indicate which heading the dropdown mega menu refers to. What is the best way to do that?

    • This reply was modified 7 years ago by tonyska.
    December 22, 2017 at 5:00 pm #891638
    tonyska

    Sorry to be a pest, is it possible to get some help on the second part of my question? Thanks!

    CSS Selectors for a Mega Menu

    December 22, 2017 at 9:13 pm #891725
    Basilis

    Hi,

    We are afraid we do not have the selectors published anywhere at all.

    Best regards,
    Basilis

    December 22, 2017 at 9:25 pm #891728
    tonyska

    Thanks! I’d like to play around with the opacity of the mega menu overlay, and create a rule under the heading to indicate which heading the dropdown mega menu refers to. What is the best way to do that?

    December 24, 2017 at 12:06 am #891876
    Mike

    Hi,
    Try this code in the General Styling > Quick CSS field:

    .header_color .avia_mega_div {
    background-color: #ffffff;
    opacity: 0.7 !important; 
}

    Each menu sub-menu has it’s own classes by menu item number, which you can combine with the page id to target each.
    2017-12-23_170235

    Best regards,
    Mike

  • Author
    Posts
Viewing 6 posts - 1 through 6 (of 6 total)
  • You must be logged in to reply to this topic.