Menu extension during page load

Question

I created a mega menu in our application. During page loading, this menu expands all elements, and then is reset (to the desired design) after page loading. This expansion occurs within a second and looks strange to the client. I believe this is a problem with the browser. What needs to be done to solve this problem?

Note. I use CSS to create menus and apply this CSS on my aspx page in a .net application.

Answer 1

In the stylesheet add

Display: no

to the root menu. here I assume this is an unordered list

So your style will be

<ul id="menu" style="display:none">...</ul> 

Add Javascript code to your page.

If you are using jQuery. Try it,

 jQuery(document).ready(function(){ jQuery('ul#menu').css('display','block'); }); 

If this does not work, provide more information in your question.

Answer 2

Initially set the menu visibility: hidden and only after loading the page set it to visible: visible