How to move down without loosing the hover box

  • Resolved guischarf

    (@guischarf)


    7 years, 3 months ago

    Hello,

    We wanted to add some space before megamenu between <ul id=”mega-menu-primary” …> and <ul class=”mega-sub-menu”>, so I added the following css rule “ul.mega-sub-menu {margin-top: 41px!important;}” in custom styling. That works, but if the cursor stays in between the two div for more than 1 second, the menu disappears. Any ideas as to to create the space above keeping the menu open when the cursor is in between the two divs?

    Thanks.

    The page I need help with: [log in to see the link]

Viewing 1 replies (of 1 total)
  • Plugin Author megamenu

    (@megamenu)

    Hi guisharf,

    Thanks for posting a link.

    When you add a margin to the top of the sub menu, hovering just above it is no different to hovering anywhere else on the page (the focus is no longer on the menu, so any open sub menus will close).

    Using HoverIntent will give you that slight delay to get your mouse from the main menu to the sub menu without it closing instantly.

    Setting the “Event” to “Click” will also work around it.

    The only other way I can think of would be to use a transparent PNG as the background image for your sub menu. It would have a (for example) solid white background with a 10px transparent bar across the top. Then add 10px padding to the sub menus also. That would all need to be done using custom CSS.

    Regards,
    Tom

Viewing 1 replies (of 1 total)
  • The topic ‘How to move down without loosing the hover box’ is closed to new replies.