JavaScript 滾動函數是一種在網頁開發中經常使用的技術，它通過編寫 JavaScript 代碼，讓網頁元素在用戶滾動頁面時產生相應的動態效果。比如說，當用戶滾動頁面時，動態更新網頁導航欄的選中狀態，或者在用戶滾動到某個特定的位置時觸發動畫效果等等，這些都可以通過 JavaScript 滾動函數實現。 JS 滾動函數的實現方式有很多種，常見的有兩種：一種是利用瀏覽器提供的 API，比如 scrollTop 屬性、window.innerHeight 等等，另一種是利用已有的 JavaScript 框架或者插件，比如 jQuery、Velocity.js 等等。 下面我們來看一些具體的代碼示例。 1. 判斷滾動位置 下面的代碼演示了如何通過 JavaScript 判斷用戶滾動頁面時的位置，當滾動到一定的高度時改變元素的 CSS 樣式。

window.addEventListener('scroll', function() {
var top = window.scrollY || document.documentElement.scrollTop;
if (top >100) {
document.querySelector('.target-element').classList.add('active');
} else {
document.querySelector('.target-element').classList.remove('active');
}
});

上面的代碼分別使用了 window.scrollY 和 document.documentElement.scrollTop 兩個 API 獲取用戶滾動的位置，然后通過判斷位置的值來更改 CSS 樣式。 2. Smooth Scroll 下面的代碼使用了插件 smoothscroll.js，可以讓用戶滾動頁面時實現平滑滾動效果。

$('a[href*="#"]').on('click', function(event) {
event.preventDefault();
$('html,body').animate({
scrollTop: $(this.hash).offset().top
}, 500);
});

上面的代碼首先監聽了 a 標簽的點擊事件，并且通過阻止默認行為來禁止 a 標簽跳轉。然后使用 animate 函數實現平滑滾動效果。 3. 滾動加載 下面的代碼示例展示了如何實現滾動加載效果，當用戶滾動到頁面底部時加載更多的內容。

$(document).scroll(function() {
var scrollTop = $(this).scrollTop();
var scrollHeight = $(document).height();
var windowHeight = $(this).height();
if (scrollTop + windowHeight >= scrollHeight - 20) {
// Do something here to load more content
}
});

上面的代碼使用了 jQuery，通過監聽 scroll 事件獲取滾動的位置，然后判斷是否到達頁面底部，如果到達頁面底部則觸發某些操作，比如加載更多的內容。 結語 本文列舉了一些常見的 JavaScript 滾動函數實現方式和代碼示例，讀者可以根據自己的需求來選擇合適的實現方式。JavaScript 滾動函數雖然簡單，但是在網頁開發中扮演著非常重要的角色，它可以讓網頁變得更加動態，更加生動。