Дизайн та розробка сайту

Кнопка возврата назад

Кнопка возвращения назад

Доброго времени суток. 🙂

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

Кнопка возвращения назад

Осуществить такую кнопку можно двумя способами. Которые по сути одинаковые, просто используют разные html-элементы. Пример таких кнопок, можете посмотреть ниже:





Первая кнопка использует элемент input type="button" - это обычная кнопка. Можете настроить ее стилями присвоив класс и превратите в соответствующий элемент Вашего сайта, подходящий по стилю. далее задаем ему событие onclick в котором маленький скрипт - history.back();, который укажет браузеру посетителя, вернутся на один шаг назад, то есть на предыдущую ссылку, от куда был совершен переход. Готовый код выглядит следующим образом:

<input type="button" onclick="history.back();" value="Назад"/>

Вторая кнопка сделана с помощью обычной ссылки, которой зададим путь - href="#" . Ссылке тоже задаем событие onclick и тот же самый скрипт, но с небольшим дополнениемhistory.back();return false;.Как видите, добавили - return false. Данный код означает, что перехода к href="#" не будет. Готовый код будет таким:

<a href="#" onclick="history.back();return false;">Назад</a>

Вот такие два простых способа, по сути один, с разными элементами. Теперь Вы сможете организовать у себя на сайте кнопку, которая будет возвращать посетителя назад.

На этом все, спасибо за внимание. 🙂

Дизайн та розробка сайту

Back to top