Я решил это с DOJO. Я использовал dijit.dialog. Вот часть моего кода:
<head>
<!-- api's (you can use also google apis: https://ajax.googleapis.com/ajax/libs/dojo/1.6.1/dojo/dojo.xd.js) -->
<link href="<%=Url.Content("~/Scripts/dojo/dijit/themes/tundra/tundra.css")%>" rel="stylesheet"
type="text/css" media="screen" />
<link href="<%=Url.Content("~/Scripts/dojo/dojo/resources/dojo.css")%>" rel="stylesheet"
type="text/css" media="screen" />
<script djconfig="parseOnLoad: true" type="text/javascript" src="<%=Url.Content("~/Scripts/dojo/dojo/dojo.js")%>"> </script>
</head>
<script type="text/javascript">
dojo.require("dijit.Dialog");
dojo.require("dijit.layout.ContentPane");
// This is the function to show the spinning whell (or something else to demonstrate the loading progress)
function wheelShow() {
var dialog = new dijit.Dialog({ title: "Loading...", id: "wheel" });
dialog.setContent("<img style='height: 55px; width: 55px; text-align:center' src='../../Content/images/loader.gif' />");
dialog.show();
// hiding of close button in dialog
dojo.query("#wheel .dijitDialogCloseIcon").forEach(function(node, index, arr) {
node.style.visibility = "hidden";
});
}
</script>
<body class="tundra">
<!-- after the page will be completly loaded - hide the wheel -->
<div id="delayedContent" onload="dijit.byId('wheel').hide()">
<!-- your page content here... -->
</div>
</body>