��Ӱ�͸��loading��demo

olachan · Apr 18, 2012 · 9f58ad0 · 9f58ad0
1 parent c281ecd
commit 9f58ad0
Show file tree

Hide file tree

Showing 4 changed files with 12 additions and 4 deletions.
diff --git a/KitJs/demo/Lightbox-Gallery/demo-2.png b/KitJs/demo/Lightbox-Gallery/demo-2.png
diff --git a/KitJs/demo/Loading/demo.html b/KitJs/demo/Loading/demo.html
@@ -27,7 +27,11 @@
 		<a href="../../index.html" class="backhome">返回首页</a>
 		<h1>Loading</h1>
 		<script>
-			new $kit.ui.SemitransparentLoading();
+			window.loading = new $kit.ui.SemitransparentLoading();
+
 		</script>
+		<button onclick="window.loading.destory()">
+			销毁loading
+		</button>
 	</body>
-</html>
+</html>
diff --git a/KitJs/demo/Loading/demo.png b/KitJs/demo/Loading/demo.png
diff --git a/KitJs/index.html b/KitJs/index.html
@@ -81,10 +81,14 @@ <h3>Kit组件列表</h3>
 				<td><a class="widget-name" id="datepicker" href="demo/DatePicker/demo.html">功能强大的日历（中文，支持多选）</a><a class="widget-preview" href="demo/DatePicker/demo.html" target="_blank"><img src="demo/DatePicker/demo.png"></a></td>
 			</tr>
 			<tr>
-				<td colspan="3"><a class="widget-name" id="datepicker_nmonth" href="demo/DatePicker/n-months.html">多月日历（支持滑动多选,界面仿Twitter风格，多语言支持，Ctrl/Shift多选支持，日期范围限制支持，自定义事件支持）</a><a class="widget-preview" href="demo/DatePicker/n-months.html" target="_blank"><img src="demo/DatePicker/nmonth.png"></a></td>
+				<td colspan="2"><a class="widget-name" id="datepicker_nmonth" href="demo/DatePicker/n-months.html">多月日历（支持滑动多选,界面仿Twitter风格，多语言支持，Ctrl/Shift多选支持，日期范围限制支持，自定义事件支持）</a><a class="widget-preview" href="demo/DatePicker/n-months.html" target="_blank"><img src="demo/DatePicker/nmonth.png"></a></td>
+				<td><a class="widget-name" id="loading" href="demo/Loading/demo.html">半透明的加载动画（非Gif）</a><a class="widget-preview" href="demo/Loading/demo.html" target="_blank"><img src="demo/Loading/demo.png"></a></td>
 			</tr>
 			<tr>
-				<td colspan="3"><a class="widget-name" id="lightbox" href="demo/Lightbox-Gallery/demo.html">散落在桌面上的相片效果，以及点击显示图片的相册效果（类似LightBox）</a><a class="widget-preview" href="demo/Lightbox-Gallery/demo.html" target="_blank"><img src="demo/Lightbox-Gallery/demo.png" width="450px"><img src="demo/Lightbox-Gallery/demo-1.png" width="450px"></a></td>
+				<td colspan="3"><a class="widget-name" id="lightbox" href="demo/Lightbox-Gallery/demo.html">散落在桌面上的相片效果，以及点击显示图片的相册效果（类似LightBox）</a>
+					<a class="widget-preview" href="demo/Lightbox-Gallery/demo.html" target="_blank">
+						<img src="demo/Lightbox-Gallery/demo.png" width="480px"><img src="demo/Lightbox-Gallery/demo-1.png" width="480px">
+					</a></td>
 			</tr>
 		</table>
 		<ul>