I have a hierarchical dropdown menu created using Drupal Megamenu module. It works good for my needs, but there is a small issue: when the page loads the whole menu tree looks expanded, and covers the entire page for a while.
It gives a hard look. I would greatly appreciate if you have any suggestions or workarounds to fix this.


Problems like this occur when you rely on JavaScript to hide things. It can take some hundred ms before it happens making the items appear upon page load.

A way to solve this, would be to use CSS to hide the expanded menu when the page is loading and once the JavaScript has been run, remove the effect of the CSS.

The easiest way to do that is by adding a class on the HTML produced, that is required in the CSS rule, and remove the class with JavaScript on page load. You could add a class to the body in the preprocess_page hook and remove it again in one of your theme's JS files.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.