隨著互聯網的發展和用戶需求的不斷增加，更多的網頁設計師和開發人員開始關注用戶體驗。其中，頁面的加載速度是一個關鍵因素。為了提高用戶感知的頁面加載速度，一種常用的解決方案是使用Ajax來進行頁面的局部刷新，從而避免了整個頁面的重載。

Ajax通過在后臺與服務器進行數據交換，實現了在不刷新整個頁面的情況下更新部分頁面的內容。鼠標滑動翻頁正是其中一個常見的應用場景，比如瀏覽新聞、照片墻等需要連續加載內容的頁面。

舉個例子，假設我們正在瀏覽一個新聞網站，每次打開頁面時只會加載少量的新聞列表，當我們滑動鼠標滾輪到頁面底部時，會通過Ajax加載更多的新聞內容，然后動態添加到頁面中，實現了不間斷的瀏覽體驗。

$(document).ready(function(){
// 定義一個變量來記錄當前頁數
var page = 1;
// 監聽鼠標滾動事件
$(window).scroll(function() {
// 如果頁面滾動到底部
if($(window).scrollTop() + $(window).height() == $(document).height()) {
// 發送Ajax請求獲取下一頁的內容
$.ajax({
url: "news.php",
type: "GET",
data: {page: page},
dataType: "json",
success: function(data) {
// 解析返回的數據并動態添加到頁面中
if(data.length >0) {
var newsHtml = "";
for(var i = 0; i< data.length; i++) {
newsHtml += "
"+data[i].title+"
"+data[i].content+"
";
}
$("body").append(newsHtml);
page++;
}
}
});
}
});
});

在上面的代碼中，我們首先定義了一個變量page來記錄當前頁數，用于向服務器請求對應頁數的新聞內容。然后，我們監聽了滾動事件scroll，當頁面滾動到底部時，就會觸發scroll事件回調函數。

在回調函數中，我們首先判斷當前頁面是否已經滾動到底部，如果是，則發送一個Ajax請求到服務器，并傳遞當前頁數。服務器返回的數據是一個JSON格式的數組，包含了新聞標題和內容等信息。

接下來，我們解析返回的數據，并將新聞內容動態添加到頁面中。通過循環遍歷數組，將每一條新聞的標題和內容包裝成HTML代碼，并添加到頁面的末尾。最后，我們將變量page加1，用于下一次請求下一頁的內容。

通過使用Ajax來實現鼠標滑動翻頁，我們能夠為用戶提供更流暢的瀏覽體驗。用戶無需等待整個頁面的加載，只需要在滑動鼠標滾輪的同時，頁面會自動加載更多的內容，用戶可以一直瀏覽下去。