Problem with menu dropdown and litespeed

[spedney]

I have a problem with the dropdown area of my header menu and after some tests I have found it goes away when I disable the litespeed plugin.

When hovering the mouse over the menu, the dropdown appears ABOVE the top link instead of below. If you do even a very small scroll up/down of the page, then the dropdown starts appearing as it should, below the menu. So, I thought it might be something to do with deferred loading of JS.

In litespeed page settings I have combine and minify css and js all set to OFF. I have tried turning off “defer js” and several other workarounds and nothing has so far helped.

Deactivate litespeed and all starts working as it should.

I will supply the site details in a secure note…

*** After more work I found that the litespeed option: “Load CSS Asynchronously” ON causes this. Switching it OFF fixes it. It says elements with attribute data-no-async=“1” in html code will be excluded. So I applied this to the inline menu as a custom attribute but it doesn’t seem to help ***

[prakash_s]

Hello @spedney,

Thanks for writing to us.

I checked your site it seems that it is working fine at my end. I would suggest you please clear your browser cache and then check it again. It would be best if you could check it in the private mode of the browser.

Thanks

[spedney]

Did you log in and turn back on async css in Litespeed as mentioned in the secure note? Also it seems to affect mostly safari

[ruenel]

Hello SteveE,

When enabling the Load CSS Asynchronously option, you must enable other options like Generate Critical CSS too. Please check out this performance video tutorial using a similar plugin:

You can check out the rest of the videos here:

[spedney]

Thank you again,
I have tried extensively, including with critical CSS on, and the menu problem still occurs.
I will try investigating more but it does seem like a bug with the way the Litespeed plugin is interacting with the theme.
For now I will just turn async css off, even though this is not ideal, as I can’t have a production site running with invisible dropdown menus. I’ll carry on investigating on a test site.

[marc_a]

Hi Steve,

Since the Lightspeed plugin is causing the issue and it’s a 3rd party plugin that is not part of our bundled plugin. Regretfully, it is outside the scope of our theme support to help you with the settings. You may seek 3rd party developers to help you with your problems or you can avail One where we can answer questions outside of the features of our theme.

Hope that helps and thank you for understanding.