Как показать блок через 3 сек (без js, без position:absolute)?

Нужно реализовать показ на странице уведомления, что не включена поддержка javascript, сейчас это реализовано так:
показать код
<style>
		.block_warning {
			animation:anim 3s ease-in;
			width: 100%;
			height: 50px;
			text-align: center;
			line-height: 50px;
			color: #fff;
			font-size: 2rem;
			background-color: #f00;
			margin: 0 auto;
			position: absolute;
			left: 0; }

		@keyframes anim {
			from {top: -360px}
			to {top: 0}}
	</style>
	<div id="no-js" class="block_warning">Внимание! У Вас в браузере отключена поддержка javascript.</div>


т.е. блок появляется сверху, а нужно чтобы он появлялся между блоками:
<header></header>
<div class="block"></div>
<main></main>


Зачем нужна задержка: при загрузке страницы, пока документ загружается, то кратковременно появляется этот блок, что не приятно.
Пояснение: javascipt скрывающий этот блок находится внизу этого же документа, т.е. это не отдельный файл. Перенести скрипт в начало страницы, тоже не вариант, так как DOM еще не сформирован.
Чем не устраивает текущий вариант, тем что блок скрывает половину шапки сайта.

PS. Сразу исключаем из вариантов javasctipt и position: absolute.
  • Вопрос задан
  • 100 просмотров
Решения вопроса 1
Tolly
@Tolly Автор вопроса
Вопрос закрываю, подсказали, что можно <noscript> пользоваться.
Сделал вывод блока так
<noscript>
	<style>
		.block {
			width: 100%;
			height: 50px;
			text-align: center;
			line-height: 50px;
			color: #fff;
			font-size: 2rem;
			background-color: #f00;
			margin: 0 auto; }
	</style>
	<div class="block">Внимание! У Вас в браузере отключена поддержка javascript.</div>
</noscript>
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы