10:48 21.12.2022
Всех с наступающим!
Дайти пример, или объясните на пальцах, как можно сделать экран загрузки? Допустим, пока страница полностью не загрузилась, на экране анимация загрузки страницы, или логотип сайта в середине экрана, а как страница полностью загружена, так анимация или логотип исчезает и появляется сама страница.
Спасибо заранее.
Дайти пример, или объясните на пальцах, как можно сделать экран загрузки? Допустим, пока страница полностью не загрузилась, на экране анимация загрузки страницы, или логотип сайта в середине экрана, а как страница полностью загружена, так анимация или логотип исчезает и появляется сама страница.
Спасибо заранее.
- Жалоба
22:55 21.12.2022
Например, так: Делаем блок с ID
Вставляем его сразу после тега
На блок с ID
Вот и все. Как-то так.
Блок с ID
preloader
, куда вставляем анимацию или лого сайта:<div id="preloader">
<img ... />
</div>
Вставляем его сразу после тега
<body>
. Чуть ниже вставляем еще один блок, со всем контентом страницы:<div id="content">
<!-- Контент страницы -->
</div>
На блок с ID
content
пишем CSS свойство display: none;
, это свойство делает блок невидимым. Теперь, при помощи JS проверяем, когда будет загружена страница полностью. Как загрузится, делаем блок с ID content
видимым, а блок с ID preloader
невидимым:$(window).on('load', function() {
$('#preloader').hide();
$('#content').show();
});
Вот и все. Как-то так.
Блок с ID
preloader
можно так же одарить разными стилями, для красоты.