Почему jQuery Mega Menu так медленно загружается?

Question

Я использую j query Mega menu, и когда моя страница загружает его, сначала отображаются все меню (включая подменю) в течение секунды секунды, когда они отображаются, а затем подменю исчезают, и они выглядят как обычные горизонтальные люди. Он в конечном итоге загружается и выглядит правильно, но его очень отвлекает и выглядит немного странно. Я могу воспроизвести это на странице примера выше.

Его почти как его пытается скрыть меню сразу после рендеринга

Кто-нибудь знает, есть ли способ, чтобы это меню нагрузки «чистая» без этого прыгающего дополнительных рендеринга?

Answer 1

Если вы используете оболочку $ .ready() для вызова инициализатора, она будет ждать, пока вся страница полностью загрузится, прежде чем готовить меню. У вас есть 2 варианта:

1. Скрыть меню с помощью CSS до инициализации.

2. Инициализируйте меню сразу после разметки.

Вот пример:

<ul id="menu"> 
    <li>...</li> 
    ... giant menu ... 
</ul> 
<script type="text/javascript"> 
    $('#menu').giantMenu(); 
</script> 

Edit: Подробнее ...

Идеальный действительно отключить Javascript и посмотреть, как выглядит страница. Вы не должны полагаться на javascript, чтобы ваша страница выглядела нормально. Это может быть так же просто, как добавить несколько классов, которые Mega Menu добавляет во время инициализации.

Answer 2

Это называется FOUC, и его можно избежать, если вы правильно нарисуете свое меню с помощью css. Таким образом, не проблема, что браузер занимает некоторое время, чтобы загрузить все необходимые .js-файлы.