update demo pages

raphealguo · Apr 28, 2016 · 8e09f42 · 8e09f42
1 parent fbfbd3c
commit 8e09f42
Show file tree

Hide file tree

Showing 9 changed files with 29 additions and 862 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,6 +1,7 @@
-#### v1.0.3 (2016-04-28)
+#### v1.0.4 (2016-04-28)
 
 - 【修复】修复package.json的main路径
+- 【优化】优化example的demo页面
 
 
 #### v1.0.2 (2016-04-27)

diff --git a/README.md b/README.md
@@ -25,10 +25,12 @@ checkout 文件 `dist/vconsole.min.js` 到本地。
 
 ### 2.引入模块
 
-(1) 如果未使用 AMD/CMD 规范，可直接在 HTML 中引入 vConsole 模块：
+(1) 如果未使用 AMD/CMD 规范，可直接在 HTML 中引入 vConsole 模块。为了便于后续扩展，建议在 `<head>` 中引入：
 
 ```html
-<script src="path/to/vconsole.min.js"></script>
+<head>
+	<script src="path/to/vconsole.min.js"></script>
+</head>
 ```
 
 (2) 如果使用了 AMD/CMD 规范，可在 module 内使用 `require()` 引入模块：

diff --git a/example/demo1.html b/example/demo1.html
@@ -6,6 +6,13 @@
   <title>vConsole/Demo1</title>
   <link href="./lib/weui.min.css" rel="stylesheet"/>
   <link href="./lib/demo.css" rel="stylesheet"/>
+
+  <script src="./lib/zepto.min.js"></script>
+  <script src="./lib/zepto.touch.min.js"></script>
+
+  <!-- 引入vConsole的JS库 -->
+  <script src="../dist/vconsole.min.js"></script>
+
 </head>
 <body ontouchstart>
   <div class="page">
@@ -24,19 +31,13 @@ <h1 class="page_title">Demo 1</h1>
   <div class="weui_toptips weui_notice" id="js_tips">已打印log</div>
 </body>
 
-<script src="./lib/jquery-1.12.3.min.js"></script>
-<script src="./lib/fastclick.js"></script>
-
-<!-- 引入vConsole的JS库 -->
-<script src="../dist/vconsole.min.js"></script>
-
 <script>
 // vConsole完成初始化后将调用ready()的回调函数
 vConsole.ready(function() {
   console.info('欢迎使用 vConsole。vConsole 是一个由微信公众平台前端团队研发的 Web 前端开发者面板，可用于展示 console 日志，方便开发、调试。');
 });
 
-$('.js_btn_log').on('click', function(e) {
+$('.js_btn_log').on('tap', function(e) {
   var type = $(this).data('type');
   console[type](type); // 例如，console.log(type)
   showTips();

diff --git a/example/demo2.php b/example/demo2.php
@@ -12,7 +12,15 @@
   <title>vConsole/Demo2</title>
   <link href="./lib/weui.min.css" rel="stylesheet"/>
   <link href="./lib/demo.css" rel="stylesheet"/>
+
+  <script src="./lib/jquery-1.12.3.min.js"></script>
+
+  <?php if ($dev_mode == '1') { ?>
+    <!-- 引入vConsole的JS库 -->
+    <script src="../dist/vconsole.min.js"></script>
+  <?php } ?>
 </head>
+
 <body ontouchstart>
   <div class="page">
     <h1 class="page_title">Demo 2</h1>
@@ -21,16 +29,7 @@
   <div class="weui_toptips weui_notice" id="js_tips">已打印log</div>
 </body>
 
-<script src="./lib/jquery-1.12.3.min.js"></script>
-<script src="./lib/fastclick.js"></script>
-
-<?php if ($dev_mode == '1') { ?>
-  <!-- 引入vConsole的JS库 -->
-  <script src="../dist/vconsole.min.js"></script>
-<?php } ?>
-
 <script>
-
 $('.js_btn_log').on('click', function(e) {
   // 打印log时无须判断是否为dev_mode，
   // 未加载vConsole时，console.log()不会显示到前台