Плавная прокрутка к заданному месту на странице
827материалов
228тем на форуме
3004комментария
6161пользователь

Плавная прокрутка к заданному месту на странице


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

Для работы плагина нужно залить папку sslide и в head вашего сайта прописать

Для работы плагина нужно залить папку sslide и в head вашего сайта прописать

Код
<script src="sslide/slide.js"></script>

Вызвать данный плагин очень просто.

Код
<a href="#services">Services</a>

Это ссылка, вызывающая плавную прокрутку. А сам элемент заключаем в divную структуру:
Код
<div id="services">  
...  
</div>

Думаю, механизм понятен. Но все же "разберем по косточкам".

Все вы заметили, что в DIVе и в ссылке есть неслучайное совпадение:
Код
<a href="#services">Services</a>

Код
<div id="services">  
...  
</div>

В роли "главного" здесь выступает DIV с контентом. Именно он задает значение атрибута href, то есть если было бы
Код
<div id="play">  
...  
</div>

То и в кнопке будут изменения:
Код
<a href="#play">Play</a>

На этом все, спасибо за внимание.

ПОСМОТРЕТЬ ДЕМО ЗАКАЗАТЬ УСТАНОВКУ

Скрипт опубликовал:
...
Логин на сайте: ...
Группа: ...
Статус: ...
Информация о скрипте:
Дата добавления материала: 19.05.2014 в 00:32
Материал просмотрен: 1029 раз
Категория материала: Скрипты для uCoz
К материалу оставлено: 0 комментариев

Пожаловаться
Сказать спасибо

0 комментариев


avatar
Вход через социальные сети
Работа в компании uCoz
uSocial - социальные кнопки
uLike – кнопка «Мне нравится»
Статистики нашего сайта