在加载网页时向用户显示消息

Question

我已经移植了一个针对Android的移动网络应用。该应用已经运行良好，位于CancerBank。当用户在Android应用程序上点击它们时，有一些超过30秒的链接可以在这里下载Android App。现在我想向用户显示页面正在加载的消息，直到页面完全加载。有没有人有一个插件，我可以用来完成这个？

我的网页应用程序是用javascript，html5和css开发的。

Answer 1

看看这个。它看起来像一个不错的插件。

http://www.gayadesign.com/scripts/queryLoader2/

Answer 2

如果您正在使用jQuery并且页面内容由ajax加载，您可以使用：

$("body").on({
    ajaxStart: function() { 
        // Your code here
    },
    ajaxStop: function() { 
        // your code here 
    }    
});

如果您不使用ajax，只需在用户点击链接时添加加载div即可。当页面加载并且用户获得新内容时，此div将再次消失，因为页面已“刷新”。 如果你真的想让他们等到加载新页面的所有内容： 添加一个始终显示的加载div，而不是使用javascript来隐藏它。

window.onload = function() {
    // hide your div
}

Answer 3

您可以默认隐藏所有页面元素（例如<div class='show_this' style='display: none;'>content</div>）并仅显示包含“加载”动画的div。然后，您将在加载页面时显示页面元素。例如。加载jQuery之后加上这个：

$(document).ready(function(){
   $('.loading_message').hide();
   $('.show_this').show();
});

这样的事可能有用。