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

24 ноября 2014 Антон Кулешов 875 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
Читайте далее

Прогресс бар как на YouTube

8 сентября 2015 Антон Кулешов

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

Ротатор баннеров – пишем сами

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

Реклама – второй двигатель прогресса, первый – человеческая лень! Далеко не секрет, что реклама – составляет фактически 90% сегодняшнего интернета. Проанализируйте, что мы видим «сёрфя» интернет паутину: магазины и сайты каталоги производителей – без комментариев; стартовая страница Яндекса – основной доход компании реклама, причём как директ, так и различные баннеры; наша с вами почта – продающий контент в ней появился сравнительно недавно, но уже прочно укрепился; социальные сети – должно быть самый извращенный вариант скрытой рекламы, поскольку контент в них, пользователем как реклама не воспринимается, и мы сыпем кучу лайков на пост, откровенно содержащий в себе кучу брендов. Собственно, редкий блогер не повесит у себя на сайте баннерную рекламу.

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

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

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