借用 ExtJS Document 中的 loading 提示做了個(gè)項(xiàng)目加載 ExtJS Loading.(嘿嘿)
?1?
<!DOCTYPE?html?PUBLIC?"-//W3C//DTD?XHTML?1.0?Transitional//EN"?"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
?2?
<html?xmlns="http://www.w3.org/1999/xhtml">
?3?
<head>
?4?
<meta?http-equiv="Content-Type"?content="text/html;?charset=UTF-8"?/>
?5?
<title>Study?ExtJS</title>
?6?
????<style?type="text/css">
?7?
????????body?{
?8?
????????????background:white;
?9?
????????}
10?
????????#loading{
11?
????????????position:absolute;
12?
????????????left:45%;
13?
????????????top:40%;
14?
????????????padding:2px;
15?
????????????z-index:20001;
16?
????????????height:auto;
17?
????????}
18?
????????#loading?a?{
19?
????????????color:#225588;
20?
????????}
21?
????????#loading?.loading-indicator{
22?
????????????background:white;
23?
????????????color:#444;
24?
????????????font:bold?13px?tahoma,arial,helvetica;
25?
????????????padding:10px;
26?
????????????margin:0;
27?
????????????height:auto;
28?
????????}
29?
????????#loading-msg?{
30?
????????????font:?normal?12px?arial,tahoma,sans-serif;
31?
????????}
32?
????</style>
33?
</head>
34?
<body>
35?
????<div?id="loading">
36?
????????<div?class="loading-indicator">
37?
????????????<img?src="images/extanim32.gif"?width="32"?height="32"?style="margin-right:8px;"?align="absmiddle"/>
38?
????????????Project?Name
39?
????????????<span?id="loading-msg">loading
</span>
40?
????????</div>
41?
????</div>
42?
????<!--?ExtJS?CSS?-->
43?
????<script?type="text/javascript">document.getElementById('loading-msg').innerHTML?=?'Loading?ExtJS?CSS';</script>
44?
????<link?rel="stylesheet"?type="text/css"?href="extjs/resources/css/ext-all-notheme.css"?/>
45?
????<link?rel="stylesheet"?type="text/css"?title="blue"??????href="extjs/resources/css/xtheme-blue.css"?/>?
46?
????<link?rel="stylesheet"?type="text/css"?title="gray"??????href="extjs/resources/css/xtheme-gray.css"?/>
47?
????<link?rel="stylesheet"?type="text/css"?title="access"????href="extjs/resources/css/xtheme-access.css"?/>
48?
????<link?rel="stylesheet"?type="text/css"?title="yourtheme"?href="extjs/resources/css/yourtheme.css"?/>
49?
????<!--?ExtJS?Core?JS?-->
50?
????<script?type="text/javascript">document.getElementById('loading-msg').innerHTML?=?'Loading ExtJS核心';</script>
51?
????<script?type="text/javascript"?src="extjs/ext-base.js"></script>
52?
????<!--?ExtJS?All?JS?-->
53?
????<script?type="text/javascript">document.getElementById('loading-msg').innerHTML?=?'Loading?UI?組件';</script>
54?
????<script?type="text/javascript"?src="extjs/ext-all.js"></script>
55?
????<!--?ExtJS?Core?Lang-zh_CN?-->
56?
????<script?type="text/javascript">document.getElementById('loading-msg').innerHTML?=?'Loading?UI?國(guó)際化資源文件';</script>
57?
????<script?type="text/javascript"?src="extjs/ext-lang-zh_CN.js"></script>
58?
????<!--?Project?Ext?JS?-->
59?
????<link?rel="stylesheet"?type="text/css"?href="css/extjs-firefox-font-size.css"?/>
60?
????
61?
????<script?type="text/javascript">document.getElementById('loading-msg').innerHTML?=?'Loading?UI?項(xiàng)目JS文件';</script>
62?
????<script?type="text/javascript"?src="js/MenuTreePanel.js"></script>
63?
????<script?type="text/javascript"?src="js/MainTabPanel.js"></script>
64?
????<script?type="text/javascript"?src="js/userManage.js"></script>
65?
????<script?type="text/javascript"?src="js/systemManage.js"></script>
66?
????<script?type="text/javascript"?src="js/Viewport.js"></script>
67?
????
68?
????<script?type="text/javascript">Ext.onReady(function(){Ext.removeNode(Ext.getDom("loading"));});</script>
69?
</body>
70?
</html>