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

166

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

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

Реализация

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

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

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

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

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



не скупись ;-) ставь лайк
Подписка на обновления:
Автор блога Рябухин Максим

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

связаться

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

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

у меня есть сайт
;-) :| :x :twisted: :smile: :shock: :sad: :roll: :razz: :oops: :o :mrgreen: :lol: :idea: :grin: :evil: :cry: :cool: :arrow: :???: :?: :!:

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

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

    Ответить
    • 2s2d

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

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


Как вам новый дизайн сайта?

Курс Бери и Зарабатывай!

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

Узнать больше!

Курс по соц. сетям