пройти авторизацию: 

Кнопка Наверх для сайта на javascript

Кнопка Наверх для сайта на javascript
2 010 3

Думаю, что уже многие успели полюбить кнопку «Наверх» на том же ВКонтакте.

На одном из моих заказов клиент захотел иметь точно такую же кноку для сайта.

После довольно длительных поисков готового решения в Интернете я понял, что ничего хорошего не найти.

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

Пришлось обратиться к системным файлам Google. В его библиотеках для собственного использования я нашел довольно простой способ реализации переброса пользователя Наверх страницы. Но в отличие от ВКонтакте, у Google этот процесс выглядит более красиво — с плавным прокручиванием.

Установить кнопку Наверх для сайта

Я свел все действия до минимума. Чтобы установить кнопку Наверх для сайта Вам надо вставить всего одну строку перед закрывающим тегом </HEAD> в HTML коде страницы.

Вот и сама строка кода:

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script><div id="goto_top">&#9650; Наверх</div>

Чтобы задать стиль кнопки (например цвет), добавьте в файл стилей вашего сайта тег:

#goto_top

Для примера вот Вам готовый нейтральный стиль кнопки:

#goto_top {padding:8px 13px; background:#c0c0c0; font:bold 16px verdana, arial, helvetica, sans-serif; text-shadow:0 2px 0 #008000; color:#fff; position:fixed; z-index:-1; top:0; left:0; width:30%; height:100%; cursor:pointer; display:none; border:0px;}

Опубликовано:
Обсуждение

Чтобы оставить своё мнение, необходимо

пройти авторизацию: 

Отзывы: 3
Дизайнер

А что, кнопочки клавиатуры Home, End, PageUp, PageDown уже отменили?

0
Zaxap

Если на то пошло, то куда лучше будет запускать браузер через командную строку, зачем ярлыки…

0
валя

ну вы не правы ребята. Такая кнопка очень удобная, какая нафиг клавиатура

2

Чтобы оставить своё мнение, необходимо

пройти авторизацию: