Перенаправление пользователя при помощи HTML

24 ноября 2014 Антон Кулешов 877 0

Если вам потребуется перенаправить пользователя на другую страницу или просто перезагрузить её, то наиболее простым способом будет воспользоваться мета тегом refresh.

Реклама

Обновление страницы осуществляется за счёт указания в атрибуте content времени.

В этом примере браузер обновит страницу через 5 секунд:

<meta http-equiv="refresh" content="5" />

Если вам нужно перенаправить пользователя, то следует дописать в атрибуте content адрес страницы, куда он должен попасть.

<meta http-equiv="refresh" content="5 url=http://falbar.ru/" />

Пользоваться мета тегом refresh стоит аккуратно. Мы же не хотим запутать человека, который зайдёт к нам на сайт. Поэтому указывайте, куда вы его отправляете и через какое время. Лучший способ это показать - воспользоваться JavaScript кодам.

Для этого мы напишем функцию timeBack(), которая будет получать значение из параграфа с id=time, уменьшая его на единицу, перезаписывая его ту даже.

function timeBack(){

	var time       = document.getElementById("time");
	time.innerText = parseInt(time.innerText) - 1;
	setTimeout("timeBack()", 1000);
};

В теле поместим сообщение и блок со временем (что-бы время доходило до нуля, указываем на одну секунду больше времени перенаправления).

<div style="text-align: center;">
	<p>
		Вы будете перенаправлены на страницу <b>http://falbar.ru/</b> через
	</p>
	<p id="time">
		6
	</p>
	<script type="text/javascript">timeBack();</script>
</div>

А перед всеми этими действиями пропишем сам мета тег:

<meta http-equiv="refresh" content="5 url=http://falbar.ru/" />

Данный подход часто используется при написании обратных форм связи. После того как пользователь заполняет форму и жмёт «отправить», он попадает на страницу показа выполнения результата обработчика. Через несколько секунд браузер возвращает его обратно. В одной из предыдущей статье я рассматривал, как написать такую форму связи, и если вам интересно увидеть реальный пример предлагаю её прочесть.

Реклама
Комментариев еще не оставлено
no_avatar
Читайте далее

Делаем подгрузку контента при прокрутке страницы

16 ноября 2014 Антон Кулешов

В настоящее время на многих сайтах можно увидеть динамически подгружаемый контент при прокрутке страницы. Этот эффект стал одной из хороших альтернатив обычной постраничной навигации. Хотя и у него есть свои недостатки, но удобство этого способа их компенсирует. Из этой статьи вы узнаете, как реализовать такой функционал у себя в проекте используя jQuery плагин jScroll.

Анимированный прогресс бар в 4 строки кода

11 декабря 2014 Антон Кулешов

Наличие на сайте прогресс бара действительно будет полезным, когда пользователю требуется сообщить о том, что на странице происходит что - то при долгом выполнении скрипта. Из этой статьи вы узнаете, как установить к себе на сайт progressbar, затратив на это всего пару минут времени.

Waves - волна под курсором

21 мая 2015 Антон Кулешов

Эффекты при клике не столь популярны как hover effects, однако, сегодня мой взор упал на плагин под названием waves.