2017-02-11 2 views
0

Это код для моего прелоадером:Preloader код - куда поместить его в HTML-документ

$(window).load(function() { 
    $(".preloader").fadeOut("slow");; 
}); 

Мой вопрос, где в HTML документ я должен поставить код. Я видел, как это было сделано по-разному на разных веб-сайтах. Некоторые помещают код внутри тегов скрипта сразу после тега <head> (прежде чем объявить их css), а другие помещают его внутри тегов скрипта после импорта css/других скриптов, так что чуть выше закрывающего тега </head>. Другие помещают его в тег скрипта непосредственно перед закрывающим тегом </body>.

Я немного смущен, потому что весь смысл предварительного загрузчика - дождаться загрузки содержимого, чтобы он не переместился вверху, прежде чем css и другие скрипты импортируют внутри тега <head>?

Спасибо.

ответ

0

Лучшая практика поместить все скрипты в нижней части тела для выполнения целей страницы рендеринга

Однако, так как вы используете событие нагрузки не имеет значения. Код внутри обработчика нагрузки не будет работать до тех пор, пока не будет загружено окно, независимо от того, где вы разместите его на странице.

Это событие не срабатывает, пока все ресурсы, которые существуют в исходном HTML не загружаются ... CSS, скрипты, изображения и т.д. Это, однако, не знает о каком-либо AJAX или другой асинхронный контент вы можете добавлять

примечание однако, что $(window).load() является устаревшим, и вы должны использовать

$(window).on('load', function() { 
    $(".preloader").fadeOut("slow"); 
}); 

и если вы не беспокоитесь о изображений можно использовать

$(function() { 
    $(".preloader").fadeOut("slow"); 
}); 
+1

может быть хорошо м ention событие '$ (document) .ready (...)', которое запускается, когда DOM готов, но не обязательно после загрузки каждого внешнего ресурса. Может иметь смысл для OP. – JCOC611

Смежные вопросы