Issue with mega menu – it closes immediately if you want to select a menu item with the mouse.

This topic has 9 replies, 2 voices, and was last updated 2 years, 3 months ago ago by Awais Ahmed

  • Avatar: PJone
    PJone
    Participant
    August 30, 2022 at 10:07

    Hello,

    Unfortunately we have another unnecessary and annoying problem.
    You can’t click on the mega menu because it closes again immediately if you want to select a menu item with the mouse.

    Hope you can help us to fix it.

    regards

    Patrick

    Please, contact administrator
    for this information.
    8 Answers
    Avatar: Awais Ahmed
    Awais Ahmed
    Participant
    August 30, 2022 at 10:14

    Hello, @PJone,

    I have just checked your site now and it is working perfectly fine at my end, please watch this video, I have captured for you: https://www.veed.io/view/f9265c43-b65f-499a-82bc-1e8b0e3a1682?sharingWidget=true

    So this must be the cache issue at your end nothing else, please try to clear the cache and check back.

    Regards 8Themes Team.

    Avatar: PJone
    PJone
    Participant
    August 30, 2022 at 10:30

    Please check on private content the screen video.
    Cache is emptied. Completely different PC, which has never called up the website. Exactly the same problem.

    Tested with Google Chrome and Firefox.

    From time to time the mega menu pops up. However, it often closes immediately before you can select a menu item.

    We’ve had this problem before. A code snippet solved the problem.

    Another question, how can I put the category title above the category picture?

    Please contact administrator
    for this information.
    Avatar: PJone
    PJone
    Participant
    August 30, 2022 at 14:44

    Hello,

    Can you please help us to solve the problem?
    I suspect that this might have something to do with the animation.

    regards

    Patrick

    Avatar: Awais Ahmed
    Awais Ahmed
    Participant
    August 31, 2022 at 06:03

    Hello, @PJone,

    1. First of all, please remove the animation from the Menu Popup, and then please go to XStore >> Theme Settings >> Speed Optimization and turn OFF “Menu Dropdown Ajax Loading” and finally check back your site after clearing the browser cache, and if the issue will persist then please clone your site on a test site and share your cloned site WP Admin URL and Credentials with me in a private content area of this topic with the permission to debug which includes deactivating all the third party plugins and on-site Customisation as well, so that I’ll check and further help you.

    2. Unfortunately this is not possible as the element you are using for showing the categories on the home page does not have the option to show the title before the image.

    OR else, you can try with this Custom CSS code:

    .elementor-element .category-grid.slide-item{flex-direction:column-reverse !important;}

    Here is the result: https://postimg.cc/RWRY35fZ

    Regards 8Themes Team.

    Avatar: PJone
    PJone
    Participant
    August 31, 2022 at 17:30

    Hello,

    1. This is already done but doesn’t seem to help
    2. I’m not talking about the slider but the title + picture also in the mega menu

    This is already the working server. So feel free to test here.
    Without your help we can’t move the project back to the live server either.

    Please check private content for FTP und WP Access

    Regards

    Patrick

    Please contact administrator
    for this information.
    Avatar: Awais Ahmed
    Awais Ahmed
    Participant
    September 1, 2022 at 06:08

    Hello, @PJone,

    1- I have added a custom CSS code in your site Dashboard >> Xstore >> Theme Options >> Theme Custom CSS >> Global see image:https://postimg.cc/zbT0h46D and the issue is resolved now kindly check back to your site after clearing the browser cache. Please watch this video for a better reference: https://www.veed.io/view/d15ab884-6c63-4cf3-b5d1-bb9e197914c7?sharingWidget=true

    2- Sorry to say that but there is no option like this in the menu to set as you want. But our theme has a feature in which you can create a mega menu using a static block. In this option, you can create a mega menu using page builder so this will be possible if you create the mega menu using the static block feature. To know how to create a mega menu using static block here is the complete video link for it: https://www.youtube.com/watch?v=f07MBdnFPfk&t=76s

    Regards 8Themes Team.

    Avatar: PJone
    PJone
    Participant
    September 5, 2022 at 15:29

    Hello,

    Padding top is not the solution.
    I took the pictures out again.
    So only the category titles should be displayed.

    But it doesn’t work at all despite cleared cache and view in multiple browsers and multiple computers.

    I am now asking for a real solution.

    regards

    Patrick

    Avatar: Awais Ahmed
    Awais Ahmed
    Participant
    September 6, 2022 at 06:21

    Hello, @PJone,

    First of all, you need to understand that, why the issue appears on the site. Please watch this video first: https://streamable.com/p050fb as you can see in this video the issue appears because of the scroll bar when I zoom out of the browser window the scroll bar is gone and the issue resolves automatically without any CSS code or any other efforts. When the mouse comes over the scroll bar the mega menu will be gone. Now, the scroll bar appears because of the menu items are too many. If you want to solve your issue without any custom CSS code then you have to set the menu zoom option as I set it on our site by navigating to the Dashboard >> XSTORE >> Theme Options >> Header Builder >> Secondary Menu then see image: https://postimg.cc/MvQ1K8RZ result will appear like this: https://postimg.cc/k6Htqjgt and second, You can also solve your issue with the help of CSS code

    Paste this code at the Dashboard >> XSTORE >> Theme Options >> Theme Custom CSS >> Global at the bottom of the CSS box. like this: https://postimg.cc/ygmzKJd0

    Below is the custom CSS code:

    @media(min-width:993px){.et_b_header-menu.et_element-top-level .item-design-mega-menu .nav-sublist-dropdown:not(.nav-sublist){top:35px !important;}}

    Now, the choice is yours.

    Regards 8Themes Team.

  • Viewing 9 results - 1 through 9 (of 9 total)

You must be logged in to reply to this topic.Log in/Sign up

We're using our own and third-party cookies to improve your experience and our website. Keep on browsing to accept our cookie policy.