Мерцание, когда вызов hide () на документе готов

Question

Я вызываю функцию hide (), когда документ готов к конкретному <div>, который по умолчанию имеет display:block и visibility:visible (мы показываем его по умолчанию и пытаемся скрыть его с помощью jQuery).

Иногда, когда я обновляю страницу, в течение доли секунды появляется <div>, а затем исчезает в соответствии с функцией hide().

Мой вопрос: есть ли способ избежать этого <div> мерцания?

Спасибо

Answer 1

Это время между рендерингом элемента и выполнением вашего кода JS. Чтобы избежать этого, нужно не помещать код в событие DOM-ready, а сразу после элемента:

<div id="whatever">...</div>
<script>$('#whatever').hide();</div>

Все остальное, например, регистрирующие обработчики событий, все же может быть включено в вашу функцию, готовую к DOM.

Да, и вам вообще не нужно использовать visibility - show() и hide() все равно будут использовать только свойство display.

---

В случае, если элемент, который вы хотите скрыть, является предупреждением «Пожалуйста, включите JavaScript», рассмотрите возможность использования <noscript>...</noscript> - тогда он никогда не появится, если JS не отключен.

Answer 2

Да, видимость по умолчанию: скрытая, и покажите () те, которые вы хотите.В качестве альтернативы, вызовите hide () сразу после загрузки html с помощью $ ('...'). Hide () сразу после соответствующего html.

'Мигание' происходит потому, что блок загружается, как толькоHTML попадает в браузер, но jquery, чтобы скрыть его, не выполняется до тех пор, пока HTML не загрузится браузером и DOM не будет готов.