Вашему вниманию простой, но безусловно актуальный скрипт для материала на сайте, как плавный скроллинг к заданному элементу, который вы самостоятельно укажете на странице, где будете размещать тот или иной материал. Сам код и его работа заключается в том, что вы по клику плавно на странице переходите к заданной надписи, или как еще говорят, где выставили якорь.
А точнее здесь имеется виду класс под названием go_to и атрибутом href=’#element’ или href=’.element’, где element — будет явятся id класс, где закрепляем для прокрутки на странице. Также при помощи animate происходит анимация, что происходит при заданной прокрутки.
Приступаем к установке:
JS
Код
$(document).ready(function(){
$('.go_to').click( function(){ // ловим клик по ссылке с классом go_to
var scroll_el = $(this).attr('href'); // возьмем содержимое атрибута href, должен быть селектором, т.е. например начинаться с # или .
if ($(scroll_el).length != 0) { // проверим существование элемента чтобы избежать ошибки
$('html, body').animate({ scrollTop: $(scroll_el).offset().top }, 500); // анимируем скроолинг к элементу scroll_el
}
return false; // выключаем стандартное действие
});
});
Устанавливаем под переход.
Код
<a class="go_to" href="#elm">Туда</a> или <a class="go_to" href=".elm">Сюда</a>
Где на странице будет происходить плавный переход к элементу с id=»elm» или class=»elm» соответственно.
UPD: Из-за очень большого количества конфликтов, которые происходят при клике, что вешается на элементы под классом go_to!
