如何製作加載符號

Question

我的頁面加載速度很慢，所以我想添加一個加載符號。我有一個加載圖像，現在我只想讓它顯示加載符號，直到它加載。我該怎麼做呢？

Answer 1

首先，請不要來Stackoverflow尋找現成的解決方案。嘗試自己解決問題。如果這不起作用，那就來這裏。
解決方案使用jQuery。

$(function(){ 
    $(".loading").delay(1000).hide(); // wait one second, then hide the loading icon, assuming that is has a class of loading. 
}); 

Answer 2

創建你的形象一個div塊和封裝在另一個div的，其餘內容：

<div id='loadingDiv'> 
    Loading... <img src='path to loading image' /> 
</div> 
<div id='content'> 
... 
</div> 

確保在CSS＃內容設置爲顯示：隱藏;

然後添加以下JS：

$(window).load(function() { 
    $('#loadingDiv').hide(); 
    $('#content').show(); 
}); 

Answer 3

添加口主體標籤下面的DIV權利。

<div class="loader"></div> 

現在添加CSS爲類

.loader { 
    position: fixed; 
    left: 0px; 
    top: 0px; 
    width: 100%; 
    height: 100%; 
    z-index: 9999; 
    background: url('images/page-loader.gif') 50% 50% no-repeat /*image that you want to show at loading time */rgb(249,249,249); 
} 

後，只是在你的HTML頁面的頭部添加這個腳本..

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
<script type="text/javascript"> 
$(window).load(function() { 
    $(".loader").fadeOut("slow"); 
}) 
</script> 

最新問題

• 1.
• 2.
• 3.
• 4.
• 5.
• 6.
• 7.
• 8.
• 9.
• 10.

 相關問題

• 1.
• 2.
• 3.
• 4.
• 5.
• 6.
• 7.
• 8.
• 9.
• 10.