Под термином «jQuery Smooth Scroll» подразумевается метод создания эффектов плавной прокрутки на веб-страницах с помощью библиотеки jQuery. Вот несколько способов добиться плавной прокрутки с помощью jQuery:
Метод 1: использование jQuery animate()
$('a[href^="#"]').on('click', function(event) {
event.preventDefault();
var target = $(this.getAttribute('href'));
if (target.length) {
$('html, body').stop().animate({
scrollTop: target.offset().top
}, 1000);
}
});
Метод 2: использование jQuery ScrollTop()
$('a[href^="#"]').on('click', function(event) {
event.preventDefault();
var target = $(this.getAttribute('href'));
if (target.length) {
$('html, body').stop().animate({
scrollTop: target.offset().top
}, 1000);
}
});
Метод 3. Использование плагинов смягчения jQuery
$('a[href^="#"]').on('click', function(event) {
event.preventDefault();
var target = $(this.getAttribute('href'));
if (target.length) {
$('html, body').stop().animate({
scrollTop: target.offset().top
}, 1000, 'easeInOutExpo');
}
});
Метод 4. Использование свойства CSS-поведения прокрутки (без jQuery)
html {
scroll-behavior: smooth;
}
Это всего лишь несколько примеров. Существует несколько других методов достижения плавной прокрутки с помощью jQuery. Выберите метод, который лучше всего соответствует требованиям вашего проекта.