Главная Блоги Улучшайзеры

Кнопки "Назад" и "Вперед"

Опубликовано:
Рубрика: JS
Редактировалось: 2 раза — последний 31 марта 2020
Просмотров: 3830
+5↑
Голосов: 5

Очередная мелочь для сайта

На этот раз коснется навигации

Итак, чтобы сделать кнопки "Назад" и "Вперед" как

ТУТ!!

, нам нужно будет проделать следующие действия:

1. Откроем файл style.css шаблона и впишем следующее:

Код PHP:
  1. #hisBack {
  2. margin: 0px;
  3.  
  4. z-index: 2;
  5. position: fixed;
  6. top: 135px;
  7. left: 0px;
  8. width: 100px;
  9. height: 40px;
  10. }
  11.  
  12. #hisForward {
  13. margin: 0px;
  14.  
  15. z-index: 2;
  16. position: fixed;
  17. top: 100px;
  18. left: 0px;
  19. width: 100px;
  20. height: 39px;
  21. }

2. Откроем файл template.php и вставим следующий код перед </body> :

Код PHP:
  1. <div id='hisForward'>
  2. <a href="javascript:history.forward()" onMouseOver="window.status='Вперед';return true">
  3. <img src='http://fan-cf.tk/images/forward.png' border=0 width=100 height=40 alt='На страницу вперед' title='На страницу вперед' /></a>
  4. </div>
  5. <div id='hisBack'>
  6. <a href="javascript:history.back()" onMouseOver="window.status='Назад';return true">
  7. <img src='http://fan-cf.tk/images/back.png' border=0 width=100 height=40 alt='На страницу назад' title='На страницу назад' /></a>
  8. </div>

По желанию меняем пути картинок на свои (ну и размеры(могу даже помочь))

Смотрим, как это выглядит

тут
Теги: назад, кнопки, вперед, js
Комментарии (0)

Нет комментариев. Ваш будет первым!

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

Голосуем

Самый нужный компонент