Merge branch 'develop'

be-fe · Dec 2, 2014 · 96b7393 · 96b7393
2 parents 17e3023 + 3bbe851
commit 96b7393
Show file tree

Hide file tree

Showing 4 changed files with 50 additions and 26 deletions.
diff --git a/README.md b/README.md
@@ -1,8 +1,9 @@
-<h1 id="intro">iSlider，Smooth slider for webapps</h1>
+#iSlider，Smooth slider for webapps
 
-<h3><a href="http://be-fe.github.io/iSlider/index_en.html">iSlider English Official Page</a></h3>
-<h3><a href="http://be-fe.github.io/iSlider/index.html">iSlider 中文官网</a></h3>
-<h3><a href="https://github.com/BE-FE/iSlider/blob/master/README_Chinese.md">iSlider 中文README</a></h3>
+####[iSlider English Official Page](http://be-fe.github.io/iSlider/index_en.html)
+####[iSlider 中文官网](http://be-fe.github.io/iSlider/index.html)
+####[iSlider 中文README](https://github.com/BE-FE/iSlider/blob/master/README_Chinese.md)
+####[iSlider Example](http://be-fe.github.io/iSlider/demo/)
 
 iSlider is a high performance，dependency free, mobile-platform javascript slider.
 It can handle any elements that need to be slide, like picture list or different dom elements. 
@@ -15,13 +16,13 @@ It features:
 * Support desktop gesture which is convenient for testing.
 * Support image preloader to improve user experience.
 
-<h2 id="demo">iSlider Mobile Demo</h2>
+##iSlider Mobile Demo
 
 <img width="150px" height="150px" src="qrcode.png"/>
 
 * <a href="http://be-fe.github.io/iSlider/demo/">Demo</a>
 
-<h2 id="getting-started">Getting Started</h2>
+##Getting Started
 The best way to learn the iSlider is by looking at the demos. In the archive you'll find a demo folder. Most of the script features are outlined there.
 *iSlider* is a class that needs to be initiated for each dom area. 
 
@@ -72,7 +73,7 @@ If you want to add more effects or options, you can follow the demo in demo/pict
 
 That's it. 
 
-<h2 id="configuration">Configure the iSlider</h2>
+##Configure the iSlider
 Besides the basic ways you can do with iSlider, you can customized the features we provide. For example, if you prefers to put dom elements on the list, you can change the data array like this:
 
 ``` javascript
@@ -104,7 +105,7 @@ If you hope to implement the effects mentioned in introduction part, you can:
     	});
     </script>
 
-<h2 id="understanding">Understand The iSlider</h2>
+##Understand The iSlider
 Here provides a clear description of what options you are able to manipulate:
 <table>
 <thead>
@@ -197,7 +198,7 @@ Here provides a clear description of what options you are able to manipulate:
 </tbody>
 </table>
 
-<h2 id="license">License (MIT)</h2>
+##License (MIT)
 
 Copyright (c) 2014 BE-FE
 

diff --git a/README_Chinese.md b/README_Chinese.md
@@ -1,9 +1,8 @@
-<h1 id="intro">iSlider</h1>
-
-<h4><a href="http://be-fe.github.io/iSlider/index_en.html">iSlider English Official Page</a></h4>
-<h4><a href="https://github.com/BE-FE/iSlider/blob/master/README.md">iSlider English README</a></h4>
-<h4><a href="http://be-fe.github.io/iSlider/index.html">iSlider 中文官网</a></h4>
-<h4><a href="http://be-fe.github.io/iSlider/demo/">iSlider Example</a></h4>
+#iSlider
+####[iSlider English Official Page](http://be-fe.github.io/iSlider/index_en.html)
+####[iSlider English README](https://github.com/BE-FE/iSlider/blob/master/README.md)
+####[iSlider 中文官网](http://be-fe.github.io/iSlider/index.html)
+####[iSlider Example](http://be-fe.github.io/iSlider/demo/)
 
 iSlider是一个表现出众，无任何插件依赖的手机平台javascript滑动组件。它能够处理任何元素，例如图片或者DOM元素。它有如下特性：
 
@@ -14,11 +13,11 @@ iSlider是一个表现出众，无任何插件依赖的手机平台javascript滑
 * 支持桌面鼠标动作，方便测试
 * 支持图片预加载，改善用户体验
 
-<h2 id="demo">iSlider移动端展示</h2>
+##iSlider移动端展示
 
 <img width="150px" height="150px" src="qrcode.png"/>
 
-<h2 id="getting-started">开始部署iSlider</h2>
+##开始部署iSlider
 部署iSlider最容易的办法是查阅我们提供的简易例子。大部份代码存放在demo文件夹的文件里面。*iSlider* 是必要新建的一个类。
 
 在你开始之前，你需要为iSlider先新建好数据:
@@ -87,7 +86,7 @@ var data = [{
 	'content' : '<div><h1>Page2</h1><h2>This is Page2</h2><p>Page2 is pretty awsome</p><div>'
 }];
 ```
-如果你想实现介绍部份提到的效果，你可以按以下格式设置: 
+如果想实现介绍部份提到的效果，可以按以下格式设置: 
 
 	<script type="text/javascript">
     	var islider = new iSlider({
@@ -101,7 +100,7 @@ var data = [{
     	});
     </script>
 
-<h2 id="understanding">深入了解iSlider</h2>
+##深入了解iSlider
 这里提供对iSlider类选项最清楚的描述: 
 <table>
 <thead>
@@ -194,7 +193,7 @@ var data = [{
 </tbody>
 </table>
 
-<h2 id="license">License (MIT)</h2>
+##License (MIT)
 
 Copyright (c) 2014 BE-FE
 

diff --git a/demo/public/js/islider.js b/demo/public/js/islider.js
@@ -316,7 +316,9 @@ iSlider.prototype._renderHTML = function () {
     }
 };
 
-// start loading image
+/**
+ *  preload img when slideChange
+ */
 iSlider.prototype._preloadImg = function(index) {
     if (!this.data[index].loaded) {
         var preloadImg = new Image();
@@ -325,7 +327,9 @@ iSlider.prototype._preloadImg = function(index) {
     }
 };
 
-// pre load image
+/**
+ *  load extra imgs when renderHTML
+ */
 iSlider.prototype._initLoadImg = function() {
     var data = this.data;
     var len = data.length;
@@ -553,6 +557,12 @@ iSlider.prototype._bindHandler = function() {
     window.addEventListener('orientationchange', orientationchangeHandler);
 };
 
+/**
+*  simple event delegate method
+*  @param {String}   evtType   event name
+*  @param {String}   selector  the simple css selector like jQuery
+*  @param {function} callback  event callback
+*/
 iSlider.prototype.bind = function(evtType, selector, callback) {
     function handle(e){
         var evt = window.event ? window.event : e;
@@ -564,6 +574,9 @@ iSlider.prototype.bind = function(evtType, selector, callback) {
     this.outer.addEventListener(evtType, handle, false);
 }
 
+/**
+* reset & rerender
+*/
 iSlider.prototype.reset = function() {
     this.pause();
     this._setting();
@@ -604,4 +617,3 @@ iSlider.prototype.extend = function(plugin, main) {
         Object.defineProperty(main, property, Object.getOwnPropertyDescriptor(plugin, property));
     });
 };
-
diff --git a/src/islider.js b/src/islider.js
@@ -316,7 +316,9 @@ iSlider.prototype._renderHTML = function () {
     }
 };
 
-// start loading image
+/**
+ *  preload img when slideChange
+ */
 iSlider.prototype._preloadImg = function(index) {
     if (!this.data[index].loaded) {
         var preloadImg = new Image();
@@ -325,7 +327,9 @@ iSlider.prototype._preloadImg = function(index) {
     }
 };
 
-// pre load image
+/**
+ *  load extra imgs when renderHTML
+ */
 iSlider.prototype._initLoadImg = function() {
     var data = this.data;
     var len = data.length;
@@ -553,6 +557,12 @@ iSlider.prototype._bindHandler = function() {
     window.addEventListener('orientationchange', orientationchangeHandler);
 };
 
+/**
+*  simple event delegate method
+*  @param {String}   evtType   event name
+*  @param {String}   selector  the simple css selector like jQuery
+*  @param {function} callback  event callback
+*/
 iSlider.prototype.bind = function(evtType, selector, callback) {
     function handle(e){
         var evt = window.event ? window.event : e;
@@ -564,6 +574,9 @@ iSlider.prototype.bind = function(evtType, selector, callback) {
     this.outer.addEventListener(evtType, handle, false);
 }
 
+/**
+* reset & rerender
+*/
 iSlider.prototype.reset = function() {
     this.pause();
     this._setting();
@@ -604,4 +617,3 @@ iSlider.prototype.extend = function(plugin, main) {
         Object.defineProperty(main, property, Object.getOwnPropertyDescriptor(plugin, property));
     });
 };
-