A little delay in menu ( open menu)

After entering the website, the first time you hover your mouse over the first menu item, ‘JEWELRY,’ the menu does not appear immediately but with a slight delay of approximately 0.5 seconds.
If you hover over it again, it appears immediately. When you refresh the page and re-enter the first or second menu, the situation remains the same

The issue does not occur in your demo. In your demo, the menu appears instantly, without any delay

What can be problem ?

Hi andrzej,

Thanks for reaching to us and appreciate your patience.

The hover effect works fine on my end, please clear browser cache and double check https://screenpal.com/watch/c0lfiJVmZKy

Regards,

The thing is that the delay in opening the mega menu is only the first time you enter the page or after refreshing it.
Look at my video again. It’s about the first mouseover after refreshing. Then there is a slight delay. The next time you invade, it won’t.

Hi andrzej,

Add the below Custom CSS code to Theme Settings > Custom CSS > Global Custom CSS.

.wd-header-nav .wd-dropdown{
	transition: none;
}

Regards,

The code you gave me causes the menu to appear quickly in the sense that there is no fading effect, it is immediate.

But I’m still talking about something else. Watch the video again, I recorded a second one.
https://youtu.be/v8SMsv4RshY

After entering the website or refreshing or clicking on the logo (i.e. refresh), any quick access to the menu causes it to not open, but when you enter again, it opens instantly. And I want it to open quickly the first time.

I especially wait a moment after refreshing, because I thought something was loading for a moment. But that’s not it

Hi andrzej,

Thanks for your patience.

Please remove previous code and use below one in order to show the dropdowns immediately after hovering before the calculation of all offsets has taken place. But, please note that in this case, horizontal shifts of the dropdowns can be visible, which cannot be resolved otherwise.

.wd-nav-main:not(.wd-offsets-calculated) .wd-event-hover:hover > .wd-dropdown, 
.wd-nav-main:not(.wd-offsets-calculated) .wd-event-click.wd-opened>.wd-dropdown, 
.wd-nav-main:not(.wd-offsets-calculated) .wd-dropdown.wd-opened {
	pointer-events: visible;
    pointer-events: unset;
    opacity: 1;
}

Regards,

The problem is that there are these horizontal shifts and it doesn’t work well, there is still a visible delay, so this code doesn’t help, even when I wait about 5 seconds after refreshing. But if I move the mouse to the last menu section ‘O NAS / ABOUT US’ and then back to the first ‘BIZUTERIA/ JEWELRY’, it appears immediately. I show this in the video.
https://www.youtube.com/watch?v=jihTx6VHl40

Can’t the code be changed or something added to it?
It’s a problem for me, because if someone quickly accesses this menu, it might not even unfold, as can be seen in the video.

I should add that in your case, this problem is practically unnoticeable. What causes this? Is it due to a faster server processing things more quickly?

Hi andrzej,

I checked your site and saw that you have not removed and added Custom CSS that I provided.

I helped you to added and it worked fine. Please clear cache and check again.

Regards,

Hi
I didn’t actually enter this code in CCS, sorry, but it doesn’t help. It’s still the same, after hovering there is a moment of delay ( it is about 0,5s ) . This really annoys me.
OF COURSE we are talking about the FIRST mouseover after refreshing the page or first visit. Then it opens quickly.
I refreshed the cache.
The strangest thing is that even if I wait, e.g. 10 seconds. after refreshing, the first hover is still delayed.
Even if some styles or something else were loaded (I don’t know), it can’t take 10 seconds.

Hi andrzej,

This is the normal behavior of dropdown mega menus. By default, all dropdowns are positioned via position: absolute match directly under their parent menu item, as shown in the screenshot (https://prnt.sc/hEKKKuPE0XNx). Having large sizes, mega menus can go beyond the edges of the screen, and to prevent this from happening, there is a special script that calculates the offset of dropdowns so that mega menus are always visible and fit on the screen regardless of their size. This can be seen in the video (https://gyazo.com/56e1959e7ef016c8709cb0e6ec81b2e7). To avoid visible shifts when opening the dropdown, they are hidden until all the necessary calculations have taken place.

You can use this code I provided in this reply https://xtemos.com/forums/topic/a-little-delay-in-menu-open-menu/#post-518997

Regards,

Maybe you are thinking about something else and that’s why we are not able to understand each other.

It’s very hard to explain, but I’m talking about a specific situation (the first entry or after reresh), where there is a delay in the menu appearing. Watch the video once again, when I hover the mouse over a menu item, like JEWELRY, there is no response for about 0.5-1 second, but if you return to JEWELRY or another menu item after a moment, the mega menu appears instantly. So, something must be happening in the background of the website that prevents the mega menu from opening instantly.
Why does this ONLY happen the first time after entering the website or after refreshing?

https://youtu.be/dv_oQMC0ggs

Hi andrzej,

I fully understood what you are trying to explain and I also described in details how mega menu works. Please read once again my answer, it also checked by our developer https://xtemos.com/forums/topic/a-little-delay-in-menu-open-menu/#post-519864

Regards,

[Author]

Posts