Question

我想在我的页面加载时显示加载动画，加载完成后显然会隐藏它。

我正在使用Masterpages在ASP.NET中工作，只是想知道使用JQuery有一种简单的方法吗？

任何指针都会受到赞赏。

由于

Answer 1

只需在页面上放置带有动画gif的图像即可。给它一个loadImage的id并添加以下脚本：

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

顺便提一下，您的网页需要多长时间才能加载？是否使用AJAX调用来加载数据？也许您应该查看这个并在回调处理程序中，调用图像上的hide（）函数。

Answer 2

考虑使用UpdateProgress控件

Answer 3

当上面的两个答案都是正确的时候，我可以在我的场景中完成我所需要的。

然而，我发现以下帖子在SO上为我提供了我所追求的解决方案。

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

感谢大家的投入。

Answer 4

我在母版页上以这种方式制作了动画：

<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>

我希望这会有所帮助。

页面加载动画

4 个答案: