JQuery Loading 特效 在網頁開發中，數據加載是非常常見的。有時候，加載需要花費大量的時間。為了改進用戶體驗，我們可以通過加載特效來提醒用戶。其中JQuery Loading特效就是一種讓用戶知道數據正在加載的方式。 JQuery Loading 特效可以通過不同的方式來實現，例如：旋轉小圖標、進度條、百分比數字等等。這篇文章將著重介紹旋轉小圖標的JQuery Loading 特效。 首先，在HTML文件中，我們需要定義一個 div 元素，作為 Loading 特效的容器。容器的樣式可以通過CSS來定義：

<style>
#loading{
position: fixed;
top: 0;
left: 0;
z-index: 999;
height: 100%;
width: 100%;
background-color: rgba(0,0,0,0.5);
display: none;
}
#loading img{
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
}
</style>

在 JavaScript 文件中，我們會使用 JQuery 來動態地顯示和隱藏按loading 特效。 在加載前，我們需要先初始化 loading 特效的容器：

$(document).ready(function(){
$('#loading').prepend('');
});

當我們需要加載數據時，可以將 loading 特效的容器顯示出來：

$('#loading').fadeIn();

同樣地，當數據加載完成時，我們需要將 loading 特效的容器隱藏：

$('#loading').fadeOut();

結論 通過 JQuery Loading 特效，可以讓用戶清楚地知道數據正在加載，并提高用戶體驗。在實際應用中，我們還可以根據需求對 loading 特效進行自定義，例如：添加完全覆蓋的 loading 特效、自定義旋轉小圖標等等，以達到更好的效果。