Main menu dropdown is very slow

Hello,

My website (https://onmag.bg/) has a dropdown menu under the word “Всички продукти” (see pic1), which is set to open when you hover over it.

The problem was, that the dropdown only appeared after the entire homepage had fully loaded. Since the homepage is loading slowly, there’s a delay in the dropdown opening.

I think that I was able to fix that using the CSS code from this topic: https://xtemos.com/forums/topic/main-menu-dropdown-very-slow/
`.website-wrapper .wd-nav-main:not(.wd-offsets-calculated) > li:hover > .wd-dropdown-menu {
opacity: 1;
pointer-events: visible;
}
But now the problem is that the menu appears out of position without content (see pic2), but once the page is fully loaded or I hover over the dropdown menu, it corrects itself.

Can you help me to fix this problem?

Attachments:

You must be logged in to view attached files.

Hello,

Send me access to your website so I can look closer at it.

Thank you in advance.

Kind Regards

Hello, Luke Nelson

I have sent you access

Hello,

Sorry for the delay.

Is it possible to disable two-factor security? https://take.ms/XYDxB

Thank you for your time and patience.

Kind Regards

Hi
I am very sorry about that. The two-factor security is disabled.

Hello,

The thing is that the dropdown calculates with the help of the JS to have such a correct view – https://prnt.sc/_r_59DvYD1JY, before calculation, the CSS from that topic hides the dropdown so you see the final result where it shows correctly.

In your case, you want to show it faster, before loading all JS scripts that calculate its position and as a result you have such a view, and it’s not possible to fix, either remove that custom and wait until it loads and will show correctly or leave it as it works now to show it faster.

As a result, you will have to choose between two options:
1. The dropdown is displayed immediately before the page is loaded and enumerated by the script, but it does not look according to the container
2. The dropdown looks on the container but is not shown until the script is calculated

Kind Regards

I understand. Thank you, Luke Nielsen, for the answer.

I have a question about JS loading.

Can I improve the menu or page speed loading by turning ON those options on the LiteSpeed Chace plugin?
1. JS Minify – ON;
2. JS Combine – ON;
3. JS Combine External and Inline – ON;

Can you give me advice – Should I use the option Load JS Deferred? The option has 3 settings:
1. OFF;
2. Deferred;
3. Delayed.

Hello,

Adjust the WP Rocket as described here – https://xtemos.com/wordpress-performance-optimization-the-ultimate-guide-in-2021/#Step_4

Kind Regards

Ok.
Thank you for the help Luke Nielsen.

Have a nice day

Hello,

You are welcome. Always remember that you can reach out to us with any questions you may have.

Have a good day!

Kind Regards

[Author]

Posts