Всі ви напевно помічали на деяких сайтах ефект при прокручуванні сторінки коліщатком мишки або за допомогою клавіатури, коли сторінка сайту прокручується плавно, а не ривками, і в кінці анімації так само плавно сповільнюється до повної зупинки. Такий ефект вже присутній в браузері FireFox, і, якщо мені не зраджує пам'ять, то такий же ефект мається на пристроях фірми Apple (iPhone, iPad і ін.) Але на інших пристроях і в інших браузерах такий ефект відсутній і прокрутка сторінки відбувається "ривками ".
Оцінити ефект плагіна ви можете безпосередньо на цій сторінці. Спробуйте відключити скрипти на сторінці і порівняти результат.
У цій статті я розповім як домогтися такого ж ефекту на вашому сайті, незалежно від пристрою і браузера.
Перше що нам слід зробити, це завантажити сам плагін jQuery.
Після скачування отриманий файл jquery.smoothscroll.js потрібно підключити до сторінок вашого сайту (з точки зору Google, підключати потрібно скрипт перед закриває тегом BODY).
На цьому ви можете завершити читання статті, так як після підключення цього скрипта ви вже отримали бажаний ефект.
Для тих, хто хотів би трохи налаштувати скрипт під себе, давайте розглянемо доступні параметри.
З того що може знадобитися налаштувати я виділив ось ці параметри:
- швидкість анімації прокрутки
- висоти прокрутки за один такт скрол миші (НЕ оборот коліщатках, а саме такт)
- крок прокрутки за одне натискання кнопок ↓ ↑ → ←
Для зміни тривалості анімації прокрутки міняємо значення 600 в цьому рядку на своє: