BloGGood.ru

Блог Костаневича Степана

WordPress, PHP, HTML, CSS, Windows

Блог на разные темы, seo-оптимизация, раскрутка сайта, создание сайта, вкусные эффекты для сайта и многое другое…

Главная » Эффекты для сайта » Кнопка “вернуться назад”.

Кнопка “вернуться назад”.

2012-11-29 / Вр:21:14 / просмотров: 32403

Часто в нашей жизни поcле неудачного случая мы ищем кнопку назад, чтобы вернуться к исходному месту. Может, я и сильно загнул со вступлением, но если в жизни и нет такой кнопочки, зато ее можно реализовать на сайте. Кнопка "вернуться назад" поможет посетителю вернуться к исходному месту, туда, откуда он начинал. Код написан на обычном javascript, вставляется в тело веб-сайта <body></body>

Кнопка вернуться назад

Кнопка вернуться назад на javascript

1. Итак, приступим. Откройте html код документа и в самом теле <body></body> пишем код javascript.

<input ENGINE="button" onclick="history.back();" value="Назад"/>
можно так:
<a href="#" onclick="history.back();return false;">Назад</a>

А вот и полностью готовая html страница с кнопкой "вернуться назад".

<html>
<body>
<input type="button" onclick="history.back();" value="Назад"/>
<a href="#" onclick="history.back();return false;">Назад</a>
</body>
</html>

2. Если хотите прописать функцию "назад" в виде картинки (это может быть картинка с красивой кнопкой), тогда используйте следующий код.  img.png - это ваша картинка (png, jpg, gif, bmp и др.).

<a href="#" onclick="history.back();return false;"><img src="img.png" alt="Картинка"/></a>

Вот полностью готовая  html страница с картинкой "вернуться назад".

<html>
<body>
<a href="#" onclick="history.back();return false;"><img src="image.png" alt="Картинка"/></a>
</body>
</html>

Вот и все. Можете смело использовать кнопку "вернуться назад" на сайте, это очень удобно, особенно, если на одной странице много информации. Если вы знаете другие методы установки кнопки "назад", пишите в комментариях.


Понравился пост? Помоги другим узнать об этой статье, кликни на кнопку социальных сетей ↓↓↓

Получай обновления блога!!! Подпишись:

Популярные статьи:

2 Ответов на комментарий - Кнопка “вернуться назад”.

  1. Drval

    Не кроссбраузерно.

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

    – не работает в Хроме.
    Работает вот так:

    <a href="javascript:history.back();">Назад</a>

    или так:

    <a href="javascript:void(0);"onclick="history.back();">Назад</a>
  2. Avatar photo Степан => автор блога

    Спасибо, Рома, за поправку, сейчас все исправлю.
    Нужно просто добавить “return false;”.
    Было так:

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

    теперь добавляем “return false;”

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

    Вот так в Хроме будет работать!

Добавить комментарий

;-) :| :x :twisted: :smokes: :smile: :shock: :sad: :rose: :roll: :razz: :pop-corne: :oops: :o :mrgreen: :lol: :idea: :grin: :gazeta: :evil: :cry: :cool: :coffe: :arrow: :???: :?: :!:

Чтобы добавить в комментарий код HTML, PHP, CSS, JavaScript, нужно сделать так: [code] ваш код [/code]

Метки: , ,

Мои цели на 2018-2019:

1). Закончить тему «Bootstrap»

2). Закончить тему «Все про PHP и MySQL»

3). Создать портфолио и мини интернет-магазин шаблонов

4). Довести количество статей до 800

5). Добиться посещаемости 3000 человек/сутки

6). Увеличить число подписчиков до 250

Статистика по блогу

Количество записей на блоге: 810
Количество страниц на блоге: 20
Количество рубрик на блоге: 28
Количество меток на блоге: 72
Количество комментариев на блоге: 4716