Еще немного функционала — кнопка вверх

468

Мне всегда нравились сайты, в которых удобный функционал. Интерес можно привлечь не только уникальным и полезным контентом, но еще и понятным интерфейсом, дополненным функциональными кнопками меню. Согласитесь, ведь очень удобно пользоваться известной социальной сетью Вконтакте, где при прослушивании огромного списка аудиозаписей, которые могут выпадать ниже сотнями, с легкостью можно вернуться к началу страницы. Так как у меня есть еще пару сайтов, кроме этого блога, мне всегда не хватало именно этого функционала — Кнопки вверх.

Кнопка вверх Вконтакте

Реализация

Прикрепить такую кнопку к своему блогу достаточно просто. В интернете огромное количество примеров, которые доступно поясняются примерами кода. Мне нравятся эффекты, поэтому, опять же, был выбран Javascript и jQuery. Открываем необходимые файлы шапки в WP, добавляем скрипты(не всегда это идет на пользу сайту) и немного работаем в Photoshop(создаем кнопку «вверх») и изменяем стили css.

Кнопка вверх на myfreelanceblog.ru

Как это работает?

Необходимо позаботится о том, чтобы кнопка появлялась только в случае прокрутки страницы вниз, поэтому изначально в стилях css должен быть «display:none», ну и конечно же, закрепим позицию свойством fixed. А сами скрипты уже «творят чудеса» анимации. Здесь я указывал задержку прокрутки, позицию появления кнопки и пр.

Теперь мой блог более функционален и более удобен, ну по крайней мере, для меня точно;)

  1. 5
  2. 4
  3. 3
  4. 2
  5. 1
(6 голосов, в среднем: 5 из 5)
не скупись ;-) оцени статью
Подписка на обновления:
Автор блога Рябухин Максим

Я фрилансер веб-разработчик. Последние несколько лет занимаюсь версткой и веб-программированием на PHP и Javascript. Если вам понадобится помощь с блогом Wordpress, либо адаптация сайта, я всегда рад помочь.

связаться

Вместе с этим советую почитать:

Оставьте комментарий

;-) :| :x :twisted: :smile: :shock: :sad: :roll: :razz: :oops: :o :mrgreen: :lol: :idea: :grin: :evil: :cry: :cool: :arrow: :???: :?: :!:
не пытайтесь оскорбить автора, либо участников блога, ваши комментарии все равно не будут промодерированы!
у меня есть сайт

комментариев: 3
  • Алексей

    Да уж, я бы тоже хотел себе такую кнопочку, но к сожалению, в программировании вообще не соображаю, приходится заказывать специалистам(.

    Ответить
    • 2s2d

      Я думаю немного упорства и желания — и всё получится!

      Ответить
показать все