頁面加載動畫

我想顯示一個加載動畫，而我的頁面加載時，加載完成後，顯然隱藏它。頁面加載動畫

我在使用Masterpages的ASP.NET工作，只是想知道有一個簡單的方法來做到這一點使用JQuery？

任何指針，將不勝感激。

感謝

2010-06-23 bigtv

只需將圖片與頁面上的gif動畫。給它一個加載圖片ID並添加以下腳本：

$(document).ready(function(){ 
    $('#loadingImage').hide(); 
});

順便說一句，您的頁面加載需要多長時間？它使用AJAX調用來加載數據嗎？也許你應該看看這個，並在回調處理程序中調用圖像上的hide（）函數。

來源

2010-06-23 11:56:09

所以簡單而有趣，有沒有辦法，而所有的頁面沒有完全加載，頁面將被禁用？ – Mostafa 2010-06-23 12:00:14

Hi @Mostafa，如果你想在頁面上禁用腳本直到加載，$（document）.ready（function ...）是初始化它們的地方。如果你想做更多的事情，可以發佈一個更詳細的問題。 – 2010-06-23 12:05:29

該頁面需要大約5秒鐘才能加載，但在我的場景中，它是在單獨的框架中加載的，因此我想向用戶提供一些反饋，否則您單擊此鏈接並且沒有任何事情發生。我已經試過你的示例代碼，但似乎一切都發生了，而不是加載div出現然後消失當主要內容被加載。我猜想某種處理程序需要更復雜的解決方案。我正在使用APP.NET AJAX如果可以做到這一點。 – bigtv 2010-06-23 13:17:14

考慮使用UpdateProgress控制

來源

2010-06-23 11:51:10

你有這樣的例子嗎？ – bigtv 2010-06-23 13:03:00

我發佈的鏈接有一個例子在頁面底部 – 2010-06-23 13:09:36

耶，對不起!!!! – bigtv 2010-06-23 13:13:00

當上面的兩個答案都沿着正確的路線行事時，我可以完全按照我的情況來做。

但是，我發現以下這篇文章是關於SO爲我提供瞭解決方案之後的。

Colorbox: Show/simulate 'loading' animation for iframe content?

感謝所有爲您的輸入。

來源

2010-06-23 18:04:14 bigtv

我我的母版頁上做出這樣的動畫：

<div id="loading" style="text-align: center" hidden><asp:Image ID="loadingImage" runat="server" ImageUrl="~/Images/loading.gif" /></div>

，然後我用jQuery的這樣

<script> 
function showLoading() { 
    $("#loading").show(); 
    } 

    var loadingTimeout = setTimeout(showLoading, 3000); 

    $(document).ready(function() { 
    clearTimeout(loadingTimeout); //make sure loader doesn't appear if page loads in less than 3 seconds 
    $("#loading").hide(); 
    }); 
</script>

我希望這將有助於。

來源

2016-07-20 19:18:00 whoiskatrin

頁面加載動畫

回答

相關問題