编译至mui v2.7.0

dist/css/mui.css

 /*!
  * =====================================================
- * Mui v2.6.0 (http://dev.dcloud.net.cn/mui)
+ * Mui v2.7.0 (http://dev.dcloud.net.cn/mui)
  * =====================================================
  */
 
@@ -730,8 +730,6 @@ p
     overflow: hidden;
 
     width: 100%;
-
-    -webkit-backface-visibility: hidden;
 }
 
 .mui-scroll
@@ -743,8 +741,6 @@ p
 
     -webkit-transform: translateZ(0);
             transform: translateZ(0);
-
-    -webkit-backface-visibility: hidden;
 }
 
 .mui-scrollbar
@@ -875,8 +871,8 @@ p
 }
 .mui-off-canvas-wrap .mui-inner-wrap.mui-transitioning
 {
-    -webkit-transition: -webkit-transform 200ms ease;
-            transition:         transform 200ms ease;
+    -webkit-transition: -webkit-transform 350ms;
+            transition:         transform 350ms cubic-bezier(.165, .84, .44, 1);
 }
 .mui-off-canvas-wrap .mui-inner-wrap .mui-off-canvas-left
 {
@@ -905,12 +901,11 @@ p
 
     display: block;
 
-    transition: background 200ms ease;
+    transition: background 350ms cubic-bezier(.165, .84, .44, 1);
 
     background: rgba(0, 0, 0, .4);
     box-shadow: -4px 0 4px rgba(0, 0, 0, .5), 4px 0 4px rgba(0, 0, 0, .5);
 
-    -webkit-backface-visibility: hidden;
     -webkit-tap-highlight-color: transparent;
 }
 .mui-off-canvas-wrap.mui-slide-in .mui-off-canvas-right
@@ -941,13 +936,12 @@ p
 
     background: #333;
 
-    -webkit-backface-visibility: hidden;
     -webkit-overflow-scrolling: touch;
 }
 .mui-off-canvas-left.mui-transitioning, .mui-off-canvas-right.mui-transitioning
 {
-    -webkit-transition: -webkit-transform 200ms ease;
-            transition:         transform 200ms ease;
+    -webkit-transition: -webkit-transform 350ms cubic-bezier(.165, .84, .44, 1);
+            transition:         transform 350ms cubic-bezier(.165, .84, .44, 1);
 }
 
 .mui-off-canvas-left
@@ -975,8 +969,8 @@ p
 }
 .mui-off-canvas-wrap:not(.mui-slide-in).mui-scalable > .mui-off-canvas-left.mui-transitioning, .mui-off-canvas-wrap:not(.mui-slide-in).mui-scalable > .mui-off-canvas-right.mui-transitioning
 {
-    -webkit-transition: -webkit-transform 200ms ease, opacity 200ms ease;
-            transition:         transform 200ms ease, opacity 200ms ease;
+    -webkit-transition: -webkit-transform 350ms cubic-bezier(.165, .84, .44, 1), opacity 350ms cubic-bezier(.165, .84, .44, 1);
+            transition:         transform 350ms cubic-bezier(.165, .84, .44, 1), opacity 350ms cubic-bezier(.165, .84, .44, 1);
 }
 .mui-off-canvas-wrap:not(.mui-slide-in).mui-scalable > .mui-off-canvas-left
 {
@@ -2155,9 +2149,6 @@ input[type='submit']:enabled:active, input[type='submit'].mui-active:enabled,
 {
     -webkit-transition: -webkit-transform 0ms ease;
             transition:         transform 0ms ease;
-
-    -webkit-backface-visibility: hidden;
-            backface-visibility: hidden;
 }
 .mui-table-view-cell > .mui-slider-left, .mui-table-view-cell > .mui-slider-right
 {
@@ -2169,9 +2160,6 @@ input[type='submit']:enabled:active, input[type='submit'].mui-active:enabled,
     display:         flex;
 
     height: 100%;
-
-    -webkit-backface-visibility: hidden;
-            backface-visibility: hidden;
 }
 .mui-table-view-cell > .mui-slider-left > .mui-btn, .mui-table-view-cell > .mui-slider-right > .mui-btn
 {
@@ -2928,7 +2916,7 @@ select:focus
 {
     padding: 8px 0;
 }
-.mui-input-row .mui-input-clear ~ .mui-icon-clear, .mui-input-row .mui-input-speech ~ .mui-icon-speech
+.mui-input-row .mui-input-clear ~ .mui-icon-clear, .mui-input-row .mui-input-speech ~ .mui-icon-speech, .mui-input-row .mui-input-password ~ .mui-icon-eye
 {
     font-size: 20px;
 
@@ -2944,6 +2932,10 @@ select:focus
 
     color: #999;
 }
+.mui-input-row .mui-input-clear ~ .mui-icon-clear.mui-active, .mui-input-row .mui-input-speech ~ .mui-icon-speech.mui-active, .mui-input-row .mui-input-password ~ .mui-icon-eye.mui-active
+{
+    color: #007aff;
+}
 .mui-input-row .mui-input-speech ~ .mui-icon-speech
 {
     font-size: 24px;
@@ -4028,8 +4020,6 @@ select:focus
 
     -webkit-transform: translateZ(0);
             transform: translateZ(0);
-
-    -webkit-backface-visibility: hidden;
 }
 
 .mui-switch
@@ -4294,8 +4284,6 @@ select:focus
     -webkit-transition-duration: 400ms;
             transition-duration: 400ms;
     vertical-align: middle;
-
-    -webkit-backface-visibility: hidden;
 }
 
 .mui-pull-loading.mui-reverse
@@ -4369,7 +4357,7 @@ select:focus
     border-radius: 3px;
     background-color: #efeff4;
 }
-.mui-numbox [class*=mui-numbox-btn]
+.mui-numbox [class*=numbox-btn], .mui-numbox [class*=btn-numbox]
 {
     font-size: 18px;
     font-weight: normal;
@@ -4389,29 +4377,29 @@ select:focus
     border-radius: 0;
     background-color: #f9f9f9;
 }
-.mui-numbox [class*=mui-numbox-btn]:active
+.mui-numbox [class*=numbox-btn]:active, .mui-numbox [class*=btn-numbox]:active
 {
     background-color: #ccc;
 }
-.mui-numbox [class*=mui-numbox-btn][disabled]
+.mui-numbox [class*=numbox-btn][disabled], .mui-numbox [class*=btn-numbox][disabled]
 {
     color: #c0c0c0;
 }
-.mui-numbox .mui-numbox-btn-plus
+.mui-numbox .mui-numbox-btn-plus, .mui-numbox .mui-btn-numbox-plus
 {
     right: 0;
 
     border-top-right-radius: 3px;
     border-bottom-right-radius: 3px;
 }
-.mui-numbox .mui-numbox-btn-minus
+.mui-numbox .mui-numbox-btn-minus, .mui-numbox .mui-btn-numbox-minus
 {
     left: 0;
 
     border-top-left-radius: 3px;
     border-bottom-left-radius: 3px;
 }
-.mui-numbox .mui-numbox-input
+.mui-numbox .mui-numbox-input, .mui-numbox .mui-input-numbox
 {
     display: inline-block;
     overflow: hidden;
@@ -4459,6 +4447,10 @@ select:focus
 
     -webkit-font-smoothing: antialiased;
 }
+.mui-icon.mui-active
+{
+    color: #007aff;
+}
 .mui-icon.mui-right:before
 {
     float: right;
@@ -4851,6 +4843,11 @@ select:focus
     content: '\e567';
 }
 
+.mui-icon-eye:before
+{
+    content: '\e568';
+}
+
 .mui-icon-arrowup:before
 {
     content: '\e580';
@@ -4946,6 +4943,13 @@ select:focus
     -webkit-user-modify: inherit;
 }
 
+.mui-android.mui-android-4-2 input,
+.mui-android.mui-android-4-2 textarea, .mui-android.mui-android-4-3 input,
+.mui-android.mui-android-4-3 textarea
+{
+    -webkit-user-select: text;
+}
+
 .mui-ios .mui-table-view-cell
 {
     -webkit-transform-style: preserve-3d;
@@ -4981,3 +4985,39 @@ select:focus
 {
     display: none !important;
 }
+
+.mui-plus.mui-statusbar.mui-statusbar-offset .mui-bar-nav
+{
+    height: 64px;
+    padding-top: 20px;
+}
+.mui-plus.mui-statusbar.mui-statusbar-offset .mui-bar-nav ~ .mui-content
+{
+    padding-top: 64px;
+}
+.mui-plus.mui-statusbar.mui-statusbar-offset .mui-bar-nav ~ .mui-content .mui-pull-top-pocket
+{
+    top: 64px;
+}
+.mui-plus.mui-statusbar.mui-statusbar-offset .mui-bar-header-secondary
+{
+    top: 64px;
+}
+.mui-plus.mui-statusbar.mui-statusbar-offset .mui-bar-header-secondary ~ .mui-content
+{
+    padding-top: 94px;
+}
+
+.mui-iframe-wrapper
+{
+    position: absolute;
+    right: 0;
+    left: 0;
+}
+.mui-iframe-wrapper iframe
+{
+    width: 100%;
+    height: 100%;
+
+    border: 0;
+}

dist/js/mui.js

 /*!
  * =====================================================
- * Mui v2.6.0 (http://dev.dcloud.net.cn/mui)
+ * Mui v2.7.0 (http://dev.dcloud.net.cn/mui)
  * =====================================================
  */
 /**
@@ -524,10 +524,29 @@ var mui = (function(document, undefined) {
 				break;
 			}
 		}
-
+	});
+	window.addEventListener('click', function(event) { //解决touch与click的target不一致的问题(比如链接边缘点击时，touch的target为html，而click的target为A)
+		var target = event.target;
+		var isFound = false;
+		for (; target && target !== document; target = target.parentNode) {
+			if (target.tagName === 'A') {
+				$.each($.targetHandles, function(index, targetHandle) {
+					var name = targetHandle.name;
+					if (targetHandle.hasOwnProperty('handle')) {
+						if (targetHandle.handle(event, target)) {
+							isFound = true;
+							event.preventDefault();
+							return false;
+						}
+					}
+				});
+				if (isFound) {
+					break;
+				}
+			}
+		}
 	});
 })(mui, window, document);
-
 /**
  * fixed trim
  * @param {type} undefined
@@ -1434,7 +1453,7 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 	//fixed hashchange(android)
 	window.addEventListener($.EVENT_CLICK, function(e) {
 		//TODO 应该判断当前target是不是在targets.popover内部，而不是非要相等
-		if (($.targets.popover && e.target === $.targets.popover) || ($.targets.tab) || $.targets.offcanvas || $.targets.modal) {
+		if (($.os.android || $.os.ios) && (($.targets.popover && e.target === $.targets.popover) || ($.targets.tab) || $.targets.offcanvas || $.targets.modal)) {
 			e.preventDefault();
 		}
 	}, true);
@@ -1472,6 +1491,7 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 				break;
 			case $.EVENT_END:
 			case $.EVENT_CANCEL:
+				touch.flick = false;
 				if (session.flickStart && options.flickMaxTime > (now - flickStartTime) && touch.distance > options.flickMinDistince) {
 					touch.flick = true;
 					touch.flickTime = now - flickStartTime;
@@ -1508,6 +1528,7 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 		var session = $.gestures.session;
 		if (event.type === $.EVENT_END || event.type === $.EVENT_CANCEL) {
 			var options = this.options;
+			touch.swipe = false;
 			//TODO 后续根据velocity计算
 			if (touch.direction && options.swipeMaxTime > touch.deltaTime && touch.distance > options.swipeMinDistince) {
 				touch.swipe = true;
@@ -1848,6 +1869,40 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 	$.addInit = function(init) {
 		return $.addAction('inits', init);
 	};
+	/**
+	 * 处理html5版本subpages 
+	 */
+	$.addInit({
+		name: 'iframe',
+		index: 100,
+		handle: function() {
+			var options = $.options;
+			var subpages = options.subpages || [];
+			if (!$.os.plus && subpages.length) {
+				//暂时只处理单个subpage。后续可以考虑支持多个subpage
+				createIframe(subpages[0]);
+			}
+		}
+	});
+	var createIframe = function(options) {
+		var wrapper = document.createElement('div');
+		wrapper.className = 'mui-iframe-wrapper';
+		var styles = options.styles || {};
+		if (typeof styles.top !== 'string') {
+			styles.top = '0px';
+		}
+		if (typeof styles.bottom !== 'string') {
+			styles.bottom = '0px';
+		}
+		wrapper.style.top = styles.top;
+		wrapper.style.bottom = styles.bottom;
+		var iframe = document.createElement('iframe');
+		iframe.src = options.url;
+		iframe.id = options.id || options.url;
+		iframe.name = iframe.id;
+		wrapper.appendChild(iframe);
+		document.body.appendChild(wrapper);
+	};
 	$(function() {
 		var classList = document.body.classList;
 		var os = [];
@@ -1923,7 +1978,10 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 	 * @returns {Object}
 	 */
 	$.waitingOptions = function(options) {
-		return $.extend(true,{},{autoShow: true,title: ''}, options);
+		return $.extend(true, {}, {
+			autoShow: true,
+			title: ''
+		}, options);
 	};
 	/**
 	 * 窗口显示配置
@@ -1931,7 +1989,7 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 	 * @returns {Object}
 	 */
 	$.showOptions = function(options) {
-		return $.extend(true,{},defaultShow, options);
+		return $.extend(true, {}, defaultShow, options);
 	};
 	/**
 	 * 窗口默认配置
@@ -2031,10 +2089,6 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 	 * @param {object} options 可选:参数,等待,窗口,显示配置{params:{},waiting:{},styles:{},show:{}}
 	 */
 	$.openWindow = function(url, id, options) {
-
-		if (!window.plus) {
-			return;
-		}
 		if (typeof url === 'object') {
 			options = url;
 			url = options.url;
@@ -2047,19 +2101,29 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 				id = id || url;
 			}
 		}
+		if (!$.os.plus) {
+			window.top.location.href = url;
+			return;
+		}
+		if (!window.plus) {
+			return;
+		}
+
 		options = options || {};
 		var params = options.params || {};
-		var webview = null,webviewCache = null, nShow, nWaiting;
+		var webview = null,
+			webviewCache = null,
+			nShow, nWaiting;
 
-		if($.webviews[id]){
+		if ($.webviews[id]) {
 			webviewCache = $.webviews[id];
 			//webview真实存在，才能获取
-			if(plus.webview.getWebviewById(id)){
+			if (plus.webview.getWebviewById(id)) {
 				webview = webviewCache.webview;
 			}
 		}
 
-		if (webviewCache&&webview) { //已缓存
+		if (webviewCache && webview) { //已缓存
 			//每次show都需要传递动画参数；
 			//预加载的动画参数优先级：openWindow配置>preloadPages配置>mui默认配置；
 			nShow = webviewCache.show;
@@ -2320,20 +2384,21 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 					}
 				});
 			} else {
-				if (subpages.length > 0) {
-					var err = document.createElement('div');
-					err.className = 'mui-error';
-					//文字描述
-					var span = document.createElement('span');
-					span.innerHTML = '在该浏览器下，不支持创建子页面，具体参考';
-					err.appendChild(span);
-					var a = document.createElement('a');
-					a.innerHTML = '"mui框架适用场景"';
-					a.href = 'http://ask.dcloud.net.cn/article/113';
-					err.appendChild(a);
-					document.body.appendChild(err);
-					console.log('在该浏览器下，不支持创建子页面');
-				}
+				//已支持iframe嵌入
+				//				if (subpages.length > 0) {
+				//					var err = document.createElement('div');
+				//					err.className = 'mui-error';
+				//					//文字描述
+				//					var span = document.createElement('span');
+				//					span.innerHTML = '在该浏览器下，不支持创建子页面，具体参考';
+				//					err.appendChild(span);
+				//					var a = document.createElement('a');
+				//					a.innerHTML = '"mui框架适用场景"';
+				//					a.href = 'http://ask.dcloud.net.cn/article/113';
+				//					err.appendChild(a);
+				//					document.body.appendChild(err);
+				//					console.log('在该浏览器下，不支持创建子页面');
+				//				}
 
 			}
 
@@ -2351,6 +2416,15 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 
 		});
 	});
+	$.supportStatusbarOffset = function() {
+		return $.os.plus && $.os.ios && parseFloat($.os.version) >= 7;
+	};
+	$.ready(function() {
+		//标识当前环境支持statusbar
+		if ($.supportStatusbarOffset()) {
+			document.body.classList.add('mui-statusbar');
+		}
+	});
 })(mui);
 /**
  * mui back
@@ -2715,7 +2789,7 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 		if (settings.cache === false || ((!options || options.cache !== true) && ('script' === dataType))) {
 			settings.url = appendQuery(settings.url, '_=' + $.now());
 		}
-		var mime = settings.accepts[dataType];
+		var mime = settings.accepts[dataType.toLowerCase()];
 		var headers = {};
 		var setHeader = function(name, value) {
 			headers[name.toLowerCase()] = [name, value];
@@ -3025,9 +3099,10 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 				scrollY: true,
 				scrollX: false,
 				indicators: true,
-				deceleration:0.003,
+				deceleration: 0.003,
 				down: {
 					height: 50,
+					contentinit: '下拉可以刷新',
 					contentdown: '下拉可以刷新',
 					contentover: '释放立即刷新',
 					contentrefresh: '正在刷新...'
@@ -3035,6 +3110,7 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 				up: {
 					height: 50,
 					auto: false,
+					contentinit: '上拉显示更多',
 					contentdown: '上拉显示更多',
 					contentrefresh: '正在加载...',
 					contentnomore: '没有更多数据了',
@@ -3088,7 +3164,7 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 		_createPocket: function(clazz, options, iconClass) {
 			var pocket = document.createElement('div');
 			pocket.className = clazz;
-			pocket.innerHTML = pocketHtml.replace('{contentrefresh}', options.contentrefresh).replace('{icon}', iconClass);
+			pocket.innerHTML = pocketHtml.replace('{contentrefresh}', options.contentinit).replace('{icon}', iconClass);
 			return pocket;
 		},
 		_resetPullDownLoading: function() {
@@ -3193,6 +3269,12 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 			fn: function(k) {
 				return Math.sqrt(1 - (--k * k));
 			}
+		},
+		outCirc: {
+			style: 'cubic-bezier(0.075, 0.82, 0.165, 1)'
+		},
+		outCubic: {
+			style: 'cubic-bezier(0.165, 0.84, 0.44, 1)'
 		}
 	}
 	var Scroll = $.Class.extend({
@@ -3207,6 +3289,7 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 				scrollX: false, //是否横向滚动
 				startX: 0, //初始化时滚动至x
 				startY: 0, //初始化时滚动至y
+
 				indicators: true, //是否显示滚动条
 				stopPropagation: false,
 				hardwareAccelerated: true,
@@ -3216,11 +3299,16 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 				},
 				momentum: true,
 
+				snapX: 0.5, //横向切换距离(以当前容器宽度为基准)
 				snap: false, //图片轮播，拖拽式选项卡
 
 				bounce: true, //是否启用回弹
-				bounceTime: 300, //回弹动画时间
-				bounceEasing: ease.circular.style, //回弹动画曲线
+				bounceTime: 500, //回弹动画时间
+				bounceEasing: ease.outCirc, //回弹动画曲线
+
+				scrollTime: 500,
+				scrollEasing: ease.outCubic, //轮播动画曲线
+
 
 				directionLockThreshold: 5,
 
@@ -3297,7 +3385,9 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 			var m = 0;
 			var n = -1;
 			var x = 0;
-			var cx = 0;
+			var leftX = 0;
+			var rightX = 0;
+			var snapX = 0;
 			for (var i = 0; i < length; i++) {
 				var snap = snaps[i];
 				var offsetLeft = snap.offsetLeft;
@@ -3310,10 +3400,13 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 					this.pages[m] = [];
 				}
 				x = this._getSnapX(offsetLeft);
-				cx = x - Math.round((offsetWidth) / 2);
+				snapX = Math.round((offsetWidth) * this.options.snapX);
+				leftX = x - snapX;
+				rightX = x - offsetWidth + snapX;
 				this.pages[m][n] = {
 					x: x,
-					cx: cx,
+					leftX: leftX,
+					rightX: rightX,
 					pageX: m,
 					element: snap
 				}
@@ -3338,7 +3431,7 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 					this.snaps[i].classList.remove(CLASS_ACTIVE);
 				}
 			}
-			this.scrollTo(this.currentPage.x, 0, this.options.bounceTime);
+			this.scrollTo(this.currentPage.x, 0, this.options.scrollTime);
 		},
 		_nearestSnap: function(x) {
 			if (!this.pages.length) {
@@ -3349,15 +3442,14 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 			}
 			var i = 0;
 			var length = this.pages.length;
-
 			if (x > 0) {
 				x = 0;
 			} else if (x < this.maxScrollX) {
 				x = this.maxScrollX;
 			}
-
 			for (; i < length; i++) {
-				if (x >= this.pages[i][0].cx) {
+				var nearestX = this.direction === 'left' ? this.pages[i][0].leftX : this.pages[i][0].rightX;
+				if (x >= nearestX) {
 					return this.pages[i][0];
 				}
 			}
@@ -3573,7 +3665,7 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 			if (!this.requestAnimationFrame) {
 				this._updateTranslate();
 			}
-
+			this.direction = detail.deltaX > 0 ? 'right' : 'left';
 			this.moved = true;
 			this.x = newX;
 			this.y = newY;
@@ -3873,7 +3965,7 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 			if (x == this.x && y == this.y) {
 				return false;
 			}
-			this.scrollTo(x, y, time, this.options.bounceEasing);
+			this.scrollTo(x, y, time, this.options.scrollEasing);
 
 			return true;
 		},
@@ -3898,7 +3990,7 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 
 		},
 		scrollToBottom: function(time, easing) {
-			time = time || this.options.bounceTime;
+			time = time || this.options.scrollTime;
 			this.scrollTo(0, this.maxScrollY, time, easing);
 		},
 		gotoPage: function(index) {
@@ -4275,7 +4367,7 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 				scrollY: false,
 				scrollX: true,
 				indicators: false,
-				bounceTime: 200,
+				scrollTime: 1000,
 				startX: false,
 				slideTime: 0, //滑动动画时间
 				snap: SELECTOR_SLIDER_ITEM
@@ -4550,7 +4642,7 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 		},
 		_gotoItem: function(slideNumber, time) {
 			this.currentPage = this._getPage(slideNumber, true); //此处传true。可保证程序切换时，动画与人手操作一致(第一张，最后一张的切换动画)
-			this.scrollTo(this.currentPage.x, 0, time, this.options.bounceEasing);
+			this.scrollTo(this.currentPage.x, 0, time, this.options.scrollEasing);
 			if (time === 0) {
 				$.trigger(this.wrapper, 'scrollend', this);
 			}
@@ -4571,17 +4663,17 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 				this.x = this.maxScrollX;
 			}
 			this.currentPage = this._nearestSnap(this.x);
-			this.scrollTo(this.currentPage.x, 0, time);
+			this.scrollTo(this.currentPage.x, 0, time, this.options.scrollEasing);
 			return true;
 		},
 		gotoItem: function(slideNumber, time) {
-			this._gotoItem(slideNumber, typeof time === 'undefined' ? this.options.bounceTime : time);
+			this._gotoItem(slideNumber, typeof time === 'undefined' ? this.options.scrollTime : time);
 		},
 		nextItem: function() {
-			this._gotoItem(this.slideNumber + 1, this.options.bounceTime);
+			this._gotoItem(this.slideNumber + 1, this.options.scrollTime);
 		},
 		prevItem: function() {
-			this._gotoItem(this.slideNumber - 1, this.options.bounceTime);
+			this._gotoItem(this.slideNumber - 1, this.options.scrollTime);
 		},
 		getSlideNumber: function() {
 			return this.slideNumber || 0;
@@ -4773,15 +4865,22 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 			}
 		},
 		pulldownLoading: function() { //该方法是子页面调用的
+			$.plusReady(function() {
+				plus.webview.currentWebview().setBounce({
+					offset: {
+						top: this.options.down.height + "px"
+					}
+				});
+			}.bind(this));
 			var callback = $.options.pullRefresh.down.callback;
 			callback && callback.call(this);
 		},
-		_pulldownLoading: function() { //该方法是子页面调用的
-			var self = this;
-			$.plusReady(function() {
-				plus.webview.getWebviewById(self.options.webviewId).evalJS("mui&&mui.options.pullRefresh.down&&mui.options.pullRefresh.down.callback()");
-			});
-		},
+		//		_pulldownLoading: function() { //该方法是子页面调用的
+		//			var self = this;
+		//			$.plusReady(function() {
+		//				plus.webview.getWebviewById(self.options.webviewId).evalJS("mui&&mui.options.pullRefresh.down&&mui.options.pullRefresh.down.callback()");
+		//			});
+		//		},
 		endPulldownToRefresh: function() { //该方法是子页面调用的
 			var webview = plus.webview.currentWebview();
 			webview.parent().evalJS("mui&&mui(document.querySelector('.mui-content')).pullRefresh('" + JSON.stringify({
@@ -4894,7 +4993,7 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 			pullRefreshApi = $.data[id];
 		}
 		if (options.down && options.down.auto) { //如果设置了auto，则自动下拉一次
-			pullRefreshApi._pulldownLoading(); //parent webview
+			pullRefreshApi.pulldownLoading(); //parent webview
 		} else if (options.up && options.up.auto) { //如果设置了auto，则自动上拉一次
 			pullRefreshApi.pullupLoading();
 		}
@@ -5094,21 +5193,23 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 								this._dispatchEvent(); //此处不触发webkitTransitionEnd,所以手动dispatch
 								return;
 							}
-							if (ratio > 0 && ratio < 0.5 && direction === 'right') {
-								this.openPercentage(0);
-							} else if (ratio > 0.5 && direction === 'left') {
+							if (direction === 'right' && ratio >= 0 && (ratio >= 0.5 || detail.swipe)) { //右滑打开
 								this.openPercentage(100);
-							} else if (ratio < 0 && ratio > -0.5 && direction === 'left') {
+							} else if (direction === 'right' && ratio < 0 && (ratio > -0.5 || detail.swipe)) { //右滑关闭
 								this.openPercentage(0);
-							} else if (direction === 'right' && ratio < 0 && ratio > -0.5) {
+							} else if (direction === 'right' && ratio > 0 && ratio < 0.5) { //右滑还原关闭
 								this.openPercentage(0);
-							} else if (ratio < 0.5 && direction === 'right') {
+							} else if (direction === 'right' && ratio < 0.5) { //右滑还原打开
 								this.openPercentage(-100);
-							} else if (direction === 'right' && ratio >= 0 && (ratio >= 0.5 || detail.flick)) {
-								this.openPercentage(100);
-							} else if (direction === 'left' && ratio <= 0 && (ratio <= -0.5 || detail.flick)) {
+							} else if (direction === 'left' && ratio <= 0 && (ratio <= -0.5 || detail.swipe)) { //左滑打开
 								this.openPercentage(-100);
-							} else {
+							} else if (direction === 'left' && ratio > 0 && (ratio <= 0.5 || detail.swipe)) { //左滑关闭
+								this.openPercentage(0);
+							} else if (direction === 'left' && ratio < 0 && ratio >= -0.5) { //左滑还原关闭
+								this.openPercentage(0);
+							} else if (direction === 'left' && ratio > 0.5) { //左滑还原打开
+								this.openPercentage(100);
+							} else { //默认关闭
 								this.openPercentage(0);
 							}
 							if (ratio === 1 || ratio === -1) { //此处不触发webkitTransitionEnd,所以手动dispatch
@@ -5120,24 +5221,22 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 							} else {
 								ratio = (this.offCanvasLeftWidth && (x / this.offCanvasLeftWidth)) || 0;
 							}
-							if (ratio >= 0.5 && direction === 'left') {
+							if (direction === 'right' && ratio <= 0 && (ratio >= -0.5 || detail.swipe)) { //右滑打开
+								this.openPercentage(100);
+							} else if (direction === 'right' && ratio > 0 && (ratio >= 0.5 || detail.swipe)) { //右滑关闭
 								this.openPercentage(0);
-							} else if (ratio > 0 && ratio <= 0.5 && direction === 'left') {
-								this.openPercentage(-100);
-							} else if (ratio >= 0.5 && direction === 'right') {
+							} else if (direction === 'right' && ratio <= -0.5) { //右滑还原关闭
 								this.openPercentage(0);
-							} else if (ratio >= -0.5 && ratio < 0 && direction === 'left') {
-								this.openPercentage(100);
-							} else if (ratio > 0 && ratio <= 0.5 && direction === 'right') {
+							} else if (direction === 'right' && ratio > 0 && ratio <= 0.5) { //右滑还原打开
+								this.openPercentage(-100);
+							} else if (direction === 'left' && ratio >= 0 && (ratio <= 0.5 || detail.swipe)) { //左滑打开
 								this.openPercentage(-100);
-							} else if (ratio <= -0.5 && direction === 'right') {
+							} else if (direction === 'left' && ratio < 0 && (ratio <= -0.5 || detail.swipe)) { //左滑关闭
 								this.openPercentage(0);
-							} else if (ratio >= -0.5 && direction === 'right') {
-								this.openPercentage(100);
-							} else if (ratio <= -0.5 && direction === 'left') {
+							} else if (direction === 'left' && ratio >= 0.5) { //左滑还原关闭
 								this.openPercentage(0);
-							} else if (ratio >= -0.5 && direction === 'left') {
-								this.openPercentage(-100);
+							} else if (direction === 'left' && ratio >= -0.5 && ratio < 0) { //左滑还原打开
+								this.openPercentage(100);
 							} else {
 								this.openPercentage(0);
 							}
@@ -5207,7 +5306,6 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 				}
 				this.classList[percentage !== 0 ? 'add' : 'remove'](CLASS_ACTIVE);
 			}
-
 		},
 		updateTranslate: function(x) {
 			if (x !== this.lastTranslateX) {
@@ -5644,7 +5742,10 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 
 	});
 
-	var togglePopover = function(popover, anchor) {
+	var togglePopover = function(popover, anchor, state) {
+		if ((state === 'show' && popover.classList.contains(CLASS_ACTIVE)) || (state === 'hide' && !popover.classList.contains(CLASS_ACTIVE))) {
+			return;
+		}
 		removeBackdropTimer && removeBackdropTimer.cancel(); //取消remove的timer
 		//remove一遍，以免来回快速切换，导致webkitTransitionEnd不触发，无法remove
 		popover.removeEventListener('webkitTransitionEnd', onPopoverShown);
@@ -5814,7 +5915,7 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 		this.each(function() {
 			$.targets._popover = this;
 			if (args[0] === 'show' || args[0] === 'hide' || args[0] === 'toggle') {
-				togglePopover(this, args[1]);
+				togglePopover(this, args[1], args[0]);
 			}
 		});
 	};
@@ -5997,6 +6098,7 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 		}
 	};
 	Toggle.prototype.start = function(e) {
+		this.handle.style.webkitTransitionDuration = this.element.style.webkitTransitionDuration = '.2s';
 		this.classList.add(CLASS_DRAGGING);
 		if (this.toggleWidth === 0 || this.handleWidth === 0) { //当switch处于隐藏状态时，width为0，需要重新初始化
 			this.init();
@@ -6034,8 +6136,13 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 			this.toggle();
 		}
 	};
-	Toggle.prototype.toggle = function() {
+	Toggle.prototype.toggle = function(animate) {
 		var classList = this.classList;
+		if (animate === false) {
+			this.handle.style.webkitTransitionDuration = this.element.style.webkitTransitionDuration = '0s';
+		} else {
+			this.handle.style.webkitTransitionDuration = this.element.style.webkitTransitionDuration = '.2s';
+		}
 		if (classList.contains(CLASS_ACTIVE)) {
 			classList.remove(CLASS_ACTIVE);
 			this.handle.style.webkitTransform = 'translate(0,0)';
@@ -6186,7 +6293,7 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 	};
 	var setTranslate = function(element, x) {
 		if (element) {
-			element.style.webkitTransform = 'translate3d(' + x + 'px,0,0)';
+			element.style.webkitTransform = 'translate(' + x + 'px,0)';
 		}
 	};
 
@@ -6757,6 +6864,7 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 	var CLASS_ICON_CLEAR = 'mui-icon-clear';
 	var CLASS_ICON_SPEECH = 'mui-icon-speech';
 	var CLASS_ICON_SEARCH = 'mui-icon-search';
+	var CLASS_ICON_PASSWORD = 'mui-icon-eye';
 	var CLASS_INPUT_ROW = 'mui-input-row';
 	var CLASS_PLACEHOLDER = 'mui-placeholder';
 	var CLASS_TOOLTIP = 'mui-tooltip';
@@ -6764,6 +6872,7 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 	var CLASS_FOCUSIN = 'mui-focusin';
 	var SELECTOR_ICON_CLOSE = '.' + CLASS_ICON_CLEAR;
 	var SELECTOR_ICON_SPEECH = '.' + CLASS_ICON_SPEECH;
+	var SELECTOR_ICON_PASSWORD = '.' + CLASS_ICON_PASSWORD;
 	var SELECTOR_PLACEHOLDER = '.' + CLASS_PLACEHOLDER;
 	var SELECTOR_TOOLTIP = '.' + CLASS_TOOLTIP;
 
@@ -6796,6 +6905,10 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 				this.searchActionClass = CLASS_PLACEHOLDER;
 				this.searchActionSelector = SELECTOR_PLACEHOLDER;
 			}
+			if (~this.options.actions.indexOf('password')) {
+				this.passwordActionClass = CLASS_ICON + ' ' + CLASS_ICON_PASSWORD;
+				this.passwordActionSelector = SELECTOR_ICON_PASSWORD;
+			}
 		}
 		this.init();
 	};
@@ -6830,7 +6943,12 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 					self.clearAction.addEventListener('tap', function(event) {
 						self.clearActionClick(event);
 					});
-
+				}
+				if (self.passwordActionClass) {
+					self.passwordAction = self.createAction(row, self.passwordActionClass, self.passwordActionSelector);
+					self.passwordAction.addEventListener('tap', function(event) {
+						self.passwordActionClick(event);
+					});
 				}
 			}
 		}
@@ -6918,6 +7036,15 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 			this.element.setAttribute('placeholder', text);
 		}
 	};
+	Input.prototype.passwordActionClick = function(event) {
+		if (this.element.type === 'text') {
+			this.element.type = 'password';
+		} else {
+			this.element.type = 'text';
+		}
+		this.passwordAction.classList.toggle('mui-active');
+		event.preventDefault();
+	};
 	Input.prototype.clearActionClick = function(event) {
 		var self = this;
 		self.element.value = '';
@@ -6969,6 +7096,9 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 				if (classList.contains('mui-input-speech')) {
 					actions.push('speech');
 				}
+				if (classList.contains('mui-input-password')) {
+					actions.push('password');
+				}
 				if (this.type === 'search' && row.classList.contains('mui-search')) {
 					actions.push('search');
 				}
@@ -7006,9 +7136,9 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 	var tapEventName = touchSupport ? 'tap' : 'click';
 	var changeEventName = 'change';
 	var holderClassName = 'mui-numbox';
-	var plusClassName = 'mui-numbox-btn-plus';
-	var minusClassName = 'mui-numbox-btn-minus';
-	var inputClassName = 'mui-numbox-input';
+	var plusClassName = 'mui-btn-numbox-plus' + "," + "mui-numbox-btn-plus";
+	var minusClassName = 'mui-btn-numbox-minus' + "," + "mui-numbox-btn-minus";
+	var inputClassName = 'mui-input-numbox' + "," + "mui-numbox-input";
 
 	var Numbox = $.Numbox = $.Class.extend({
 		/**
@@ -7099,7 +7229,9 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 		var instanceArray = [];
 		//遍历选择的元素
 		this.each(function(i, element) {
-			if (element.numbox) return;
+			if (element.numbox) {
+				return;
+			}
 			if (options) {
 				element.numbox = new Numbox(element, options);
 			} else {

examples/hello-mui/css/app.css

@@ -3,9 +3,9 @@
  * 在实际项目开发时，建议为App单独写一个css文件，从而实现项目的自定义皮肤功能；
  * 
  * */
-.mui-android header.mui-bar{
+.mui-plus.mui-android header.mui-bar{
 	display: none;
 }
-.mui-android .mui-bar-nav~.mui-content{
+.mui-plus.mui-android .mui-bar-nav~.mui-content{
 	padding: 0;
 }
\ No newline at end of file

examples/hello-mui/css/mui.css

 /*!
  * =====================================================
- * Mui v2.6.0 (http://dev.dcloud.net.cn/mui)
+ * Mui v2.7.0 (http://dev.dcloud.net.cn/mui)
  * =====================================================
  */
 
@@ -730,8 +730,6 @@ p
     overflow: hidden;
 
     width: 100%;
-
-    -webkit-backface-visibility: hidden;
 }
 
 .mui-scroll
@@ -743,8 +741,6 @@ p
 
     -webkit-transform: translateZ(0);
             transform: translateZ(0);
-
-    -webkit-backface-visibility: hidden;
 }
 
 .mui-scrollbar
@@ -875,8 +871,8 @@ p
 }
 .mui-off-canvas-wrap .mui-inner-wrap.mui-transitioning
 {
-    -webkit-transition: -webkit-transform 200ms ease;
-            transition:         transform 200ms ease;
+    -webkit-transition: -webkit-transform 350ms;
+            transition:         transform 350ms cubic-bezier(.165, .84, .44, 1);
 }
 .mui-off-canvas-wrap .mui-inner-wrap .mui-off-canvas-left
 {
@@ -905,12 +901,11 @@ p
 
     display: block;
 
-    transition: background 200ms ease;
+    transition: background 350ms cubic-bezier(.165, .84, .44, 1);
 
     background: rgba(0, 0, 0, .4);
     box-shadow: -4px 0 4px rgba(0, 0, 0, .5), 4px 0 4px rgba(0, 0, 0, .5);
 
-    -webkit-backface-visibility: hidden;
     -webkit-tap-highlight-color: transparent;
 }
 .mui-off-canvas-wrap.mui-slide-in .mui-off-canvas-right
@@ -941,13 +936,12 @@ p
 
     background: #333;
 
-    -webkit-backface-visibility: hidden;
     -webkit-overflow-scrolling: touch;
 }
 .mui-off-canvas-left.mui-transitioning, .mui-off-canvas-right.mui-transitioning
 {
-    -webkit-transition: -webkit-transform 200ms ease;
-            transition:         transform 200ms ease;
+    -webkit-transition: -webkit-transform 350ms cubic-bezier(.165, .84, .44, 1);
+            transition:         transform 350ms cubic-bezier(.165, .84, .44, 1);
 }
 
 .mui-off-canvas-left
@@ -975,8 +969,8 @@ p
 }
 .mui-off-canvas-wrap:not(.mui-slide-in).mui-scalable > .mui-off-canvas-left.mui-transitioning, .mui-off-canvas-wrap:not(.mui-slide-in).mui-scalable > .mui-off-canvas-right.mui-transitioning
 {
-    -webkit-transition: -webkit-transform 200ms ease, opacity 200ms ease;
-            transition:         transform 200ms ease, opacity 200ms ease;
+    -webkit-transition: -webkit-transform 350ms cubic-bezier(.165, .84, .44, 1), opacity 350ms cubic-bezier(.165, .84, .44, 1);
+            transition:         transform 350ms cubic-bezier(.165, .84, .44, 1), opacity 350ms cubic-bezier(.165, .84, .44, 1);
 }
 .mui-off-canvas-wrap:not(.mui-slide-in).mui-scalable > .mui-off-canvas-left
 {
@@ -2155,9 +2149,6 @@ input[type='submit']:enabled:active, input[type='submit'].mui-active:enabled,
 {
     -webkit-transition: -webkit-transform 0ms ease;
             transition:         transform 0ms ease;
-
-    -webkit-backface-visibility: hidden;
-            backface-visibility: hidden;
 }
 .mui-table-view-cell > .mui-slider-left, .mui-table-view-cell > .mui-slider-right
 {
@@ -2169,9 +2160,6 @@ input[type='submit']:enabled:active, input[type='submit'].mui-active:enabled,
     display:         flex;
 
     height: 100%;
-
-    -webkit-backface-visibility: hidden;
-            backface-visibility: hidden;
 }
 .mui-table-view-cell > .mui-slider-left > .mui-btn, .mui-table-view-cell > .mui-slider-right > .mui-btn
 {
@@ -2928,7 +2916,7 @@ select:focus
 {
     padding: 8px 0;
 }
-.mui-input-row .mui-input-clear ~ .mui-icon-clear, .mui-input-row .mui-input-speech ~ .mui-icon-speech
+.mui-input-row .mui-input-clear ~ .mui-icon-clear, .mui-input-row .mui-input-speech ~ .mui-icon-speech, .mui-input-row .mui-input-password ~ .mui-icon-eye
 {
     font-size: 20px;
 
@@ -2944,6 +2932,10 @@ select:focus
 
     color: #999;
 }
+.mui-input-row .mui-input-clear ~ .mui-icon-clear.mui-active, .mui-input-row .mui-input-speech ~ .mui-icon-speech.mui-active, .mui-input-row .mui-input-password ~ .mui-icon-eye.mui-active
+{
+    color: #007aff;
+}
 .mui-input-row .mui-input-speech ~ .mui-icon-speech
 {
     font-size: 24px;
@@ -4028,8 +4020,6 @@ select:focus
 
     -webkit-transform: translateZ(0);
             transform: translateZ(0);
-
-    -webkit-backface-visibility: hidden;
 }
 
 .mui-switch
@@ -4294,8 +4284,6 @@ select:focus
     -webkit-transition-duration: 400ms;
             transition-duration: 400ms;
     vertical-align: middle;
-
-    -webkit-backface-visibility: hidden;
 }
 
 .mui-pull-loading.mui-reverse
@@ -4369,7 +4357,7 @@ select:focus
     border-radius: 3px;
     background-color: #efeff4;
 }
-.mui-numbox [class*=mui-numbox-btn]
+.mui-numbox [class*=numbox-btn], .mui-numbox [class*=btn-numbox]
 {
     font-size: 18px;
     font-weight: normal;
@@ -4389,29 +4377,29 @@ select:focus
     border-radius: 0;
     background-color: #f9f9f9;
 }
-.mui-numbox [class*=mui-numbox-btn]:active
+.mui-numbox [class*=numbox-btn]:active, .mui-numbox [class*=btn-numbox]:active
 {
     background-color: #ccc;
 }
-.mui-numbox [class*=mui-numbox-btn][disabled]
+.mui-numbox [class*=numbox-btn][disabled], .mui-numbox [class*=btn-numbox][disabled]
 {
     color: #c0c0c0;
 }
-.mui-numbox .mui-numbox-btn-plus
+.mui-numbox .mui-numbox-btn-plus, .mui-numbox .mui-btn-numbox-plus
 {
     right: 0;
 
     border-top-right-radius: 3px;
     border-bottom-right-radius: 3px;
 }
-.mui-numbox .mui-numbox-btn-minus
+.mui-numbox .mui-numbox-btn-minus, .mui-numbox .mui-btn-numbox-minus
 {
     left: 0;
 
     border-top-left-radius: 3px;
     border-bottom-left-radius: 3px;
 }
-.mui-numbox .mui-numbox-input
+.mui-numbox .mui-numbox-input, .mui-numbox .mui-input-numbox
 {
     display: inline-block;
     overflow: hidden;
@@ -4459,6 +4447,10 @@ select:focus
 
     -webkit-font-smoothing: antialiased;
 }
+.mui-icon.mui-active
+{
+    color: #007aff;
+}
 .mui-icon.mui-right:before
 {
     float: right;
@@ -4851,6 +4843,11 @@ select:focus
     content: '\e567';
 }
 
+.mui-icon-eye:before
+{
+    content: '\e568';
+}
+
 .mui-icon-arrowup:before
 {
     content: '\e580';
@@ -4946,6 +4943,13 @@ select:focus
     -webkit-user-modify: inherit;
 }
 
+.mui-android.mui-android-4-2 input,
+.mui-android.mui-android-4-2 textarea, .mui-android.mui-android-4-3 input,
+.mui-android.mui-android-4-3 textarea
+{
+    -webkit-user-select: text;
+}
+
 .mui-ios .mui-table-view-cell
 {
     -webkit-transform-style: preserve-3d;
@@ -4981,3 +4985,39 @@ select:focus
 {
     display: none !important;
 }
+
+.mui-plus.mui-statusbar.mui-statusbar-offset .mui-bar-nav
+{
+    height: 64px;
+    padding-top: 20px;
+}
+.mui-plus.mui-statusbar.mui-statusbar-offset .mui-bar-nav ~ .mui-content
+{
+    padding-top: 64px;
+}
+.mui-plus.mui-statusbar.mui-statusbar-offset .mui-bar-nav ~ .mui-content .mui-pull-top-pocket
+{
+    top: 64px;
+}
+.mui-plus.mui-statusbar.mui-statusbar-offset .mui-bar-header-secondary
+{
+    top: 64px;
+}
+.mui-plus.mui-statusbar.mui-statusbar-offset .mui-bar-header-secondary ~ .mui-content
+{
+    padding-top: 94px;
+}
+
+.mui-iframe-wrapper
+{
+    position: absolute;
+    right: 0;
+    left: 0;
+}
+.mui-iframe-wrapper iframe
+{
+    width: 100%;
+    height: 100%;
+
+    border: 0;
+}

examples/hello-mui/examples/accordion.html

@@ -3,7 +3,7 @@
 
 	<head>
 		<meta charset="utf-8">
-		<title>Hello MUI</title>
+		<title>accordion（折叠面板）</title>
 		<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
 		<meta name="apple-mobile-web-app-capable" content="yes">
 		<meta name="apple-mobile-web-app-status-bar-style" content="black">
@@ -17,7 +17,7 @@
 	<body>
 		<header class="mui-bar mui-bar-nav">
 			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
-			<h1 class="mui-title">折叠面板</h1>
+			<h1 class="mui-title">accordion（折叠面板）</h1>
 		</header>
 		<div class="mui-content">
 			<div class="mui-card">

examples/hello-mui/examples/dtpicker.html

@@ -37,6 +37,10 @@
 				padding: 20px 10px;
 				font-size: 16px;
 			}
+			* {
+				-webkit-touch-callout: none;
+				-webkit-user-select: none;
+			}
 		</style>
 	</head>
 
@@ -63,7 +67,7 @@
 			</div>
 		</div>
 		<script src="../js/mui.min.js"></script>
-		<!--<script src="../js/mui.picker.js"></script>
+		<!--<script src="../js/mui.picker.js"></script>
 		<script src="../js/mui.dtpicker.js"></script>-->
 		<script src="../js/mui.picker.min.js"></script>
 		<script>

examples/hello-mui/examples/icons.html

@@ -11,7 +11,7 @@
 		<!--标准mui.css-->
 		<link rel="stylesheet" href="../css/mui.min.css">
 		<!--App自定义的css-->
-		<!-- <link rel="stylesheet" type="text/css" href="../css/app.css"/> -->
+		<link rel="stylesheet" type="text/css" href="../css/app.css"/>
 		<style>
 			.flex-container {
 				display: -webkit-box;
@@ -121,9 +121,9 @@
 					<a id="icon-help"><span class="mui-icon mui-icon-help"></span></a>
 					<a><span class="mui-icon mui-icon-locked"></span></a>
 					<a id="icon-more"><span class="mui-icon mui-icon-more"></span></a>
-					<!--<a><span class="mui-icon mui-icon-more-vertical"></span></a>-->
 					<a><span class="mui-icon mui-icon-flag"></span></a>
 					<a><span class="mui-icon mui-icon-paperclip"></span></a>
+					<a><span class="mui-icon mui-icon-eye"></span></a>
 
 
 

examples/hello-mui/examples/info.html

@@ -11,25 +11,38 @@
 		<!--标准mui.css-->
 		<link rel="stylesheet" href="../css/mui.min.css">
 		<!--App自定义的css-->
-		<!--<link rel="stylesheet" type="text/css" href="../css/app.css"/>-->
+		<link rel="stylesheet" type="text/css" href="../css/app.css" />
 		<style>
 			p {
 				text-indent: 22px;
 				padding: 5px 8px;
 			}
-			html,body,.mui-content {
+			
+			html,
+			body,
+			.mui-content {
 				background-color: #fff;
 			}
+			
 			h4 {
 				margin-left: 5px;
 			}
+			
+			.mui-plus header.mui-bar {
+				display: none;
+			}
+			
+			.mui-plus .mui-bar-nav~.mui-content {
+				padding: 0;
+			}
 		</style>
 	</head>
+
 	<body>
-		<!--<header class="mui-bar mui-bar-nav">
+		<header class="mui-bar mui-bar-nav">
 			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
 			<h1 class="mui-title">关于</h1>
-		</header>-->
+		</header>
 		<div class="mui-content">
 			<div class="mui-content-padded">
 				<h4 style="margin-top:10px;">mui</h4>
@@ -48,7 +61,7 @@
 				</p>
 				<p>更多详细介绍，请到<a href="http://dcloudio.github.io/mui">mui官网</a>查看；</p>
 				<h4>版本介绍</h4>
-				<p>当前版本为2.6.0，可到<a href="https://github.com/dcloudio/mui">Github</a>上获取最新版本。</p>
+				<p>当前版本为2.7.0，可到<a href="https://github.com/dcloudio/mui">Github</a>上获取最新版本。</p>
 				<h4>License</h4>
 				<p>
 					mui遵循MIT License，源码已提交至Github，<a href="https://github.com/dcloudio/mui">点击查看</a>;
@@ -58,7 +71,7 @@
 		<script src="../js/mui.min.js"></script>
 		<script type="text/javascript" charset="utf-8">
 			mui.init({
-				swipeBack:true //启用右滑关闭功能
+				swipeBack: true //启用右滑关闭功能
 			});
 			//处理点击事件，需要打开原生浏览器
 			mui('body').on('tap', 'a', function(e) {
@@ -73,4 +86,5 @@
 			});
 		</script>
 	</body>
+
 </html>
\ No newline at end of file

examples/hello-mui/examples/input.html

@@ -11,7 +11,7 @@
 		<!--标准mui.css-->
 		<link rel="stylesheet" href="../css/mui.min.css">
 		<!--App自定义的css-->
-		<link rel="stylesheet" type="text/css" href="../css/app.css"/>
+		<link rel="stylesheet" type="text/css" href="../css/app.css" />
 		<style>
 			h5 {
 				margin: 5px 7px;
@@ -30,10 +30,14 @@
 				<div class="mui-input-row mui-search">
 					<input type="search" class="mui-input-clear" placeholder="">
 				</div>
-				<h5>语音输入搜索框：</h5>
-				<div class="mui-input-row mui-search">
+				<h5 class="mui-plus-visible">语音输入搜索框：</h5>
+				<div class="mui-input-row mui-search mui-plus-visible">
 					<input id="search" type="search" class="mui-input-speech mui-input-clear" placeholder="带语音输入的搜索框">
 				</div>
+				<h5>密码框：</h5>
+				<div class="mui-input-row mui-password">
+					<input type="password" class="mui-input-password">
+				</div>
 				<form class="mui-input-group">
 					<div class="mui-input-row">
 						<label>Input</label>
@@ -44,7 +48,7 @@
 						<input type="text" class="mui-input-clear" placeholder="带清除按钮的输入框">
 					</div>
 
-					<div class="mui-input-row">
+					<div class="mui-input-row mui-plus-visible">
 						<label>Input</label>
 						<input type="text" class="mui-input-speech mui-input-clear" placeholder="语音输入">
 					</div>
@@ -61,7 +65,7 @@
 		<script src="../js/mui.min.js"></script>
 		<script>
 			mui.init({
-				swipeBack:true //启用右滑关闭功能
+				swipeBack: true //启用右滑关闭功能
 			});
 			 //语音识别完成事件
 			document.getElementById("search").addEventListener('recognized', function(e) {
@@ -69,4 +73,5 @@
 			});
 		</script>
 	</body>
+
 </html>
\ No newline at end of file

examples/hello-mui/examples/numbox.html

@@ -10,7 +10,7 @@
 		<!--标准mui.css-->
 		<link rel="stylesheet" href="../css/mui.min.css">
 		<!--App自定义的css-->
-		<link rel="stylesheet" type="text/css" href="../css/app.css"/>
+		<link rel="stylesheet" type="text/css" href="../css/app.css" />
 		<style>
 			html,
 			body,
@@ -38,34 +38,34 @@
 			<div class="mui-content-padded">
 				<h5 class="mui-content-padded">默认</h5>
 				<div class="mui-numbox">
-					<button class="mui-btn mui-numbox-btn-minus" type="button">-</button>
-					<input class="mui-numbox-input" type="number" />
-					<button class="mui-btn mui-numbox-btn-plus" type="button">+</button>
+					<button class="mui-btn mui-btn-numbox-minus" type="button">-</button>
+					<input class="mui-input-numbox" type="number" />
+					<button class="mui-btn mui-btn-numbox-plus" type="button">+</button>
 				</div>
 				<h5 class="mui-content-padded">限定最小值和最大值(1~9)</h5>
 				<div class="mui-numbox" data-numbox-min='1' data-numbox-max='9'>
-					<button class="mui-btn mui-numbox-btn-minus" type="button">-</button>
-					<input class="mui-numbox-input" type="number" value="5" />
-					<button class="mui-btn mui-numbox-btn-plus" type="button">+</button>
+					<button class="mui-btn mui-btn-numbox-minus" type="button">-</button>
+					<input id="test" class="mui-input-numbox" type="number" value="5" />
+					<button class="mui-btn mui-btn-numbox-plus" type="button">+</button>
 				</div>
 				<h5 class="mui-content-padded">设定步长值(步长 10)</h5>
 				<div class="mui-numbox" data-numbox-step='10' data-numbox-min='10' data-numbox-max='90'>
-					<button class="mui-btn mui-numbox-btn-minus" type="button">-</button>
-					<input class="mui-numbox-input" type="number" />
-					<button class="mui-btn mui-numbox-btn-plus" type="button">+</button>
+					<button class="mui-btn mui-btn-numbox-minus" type="button">-</button>
+					<input class="mui-input-numbox" type="number" />
+					<button class="mui-btn mui-btn-numbox-plus" type="button">+</button>
 				</div>
 				<h5 class="mui-content-padded">取值操作</h5>
 				<div class="mui-numbox">
-					<button class="mui-btn mui-numbox-btn-minus" type="button">-</button>
-					<input id="box" class="mui-numbox-input" type="number" />
-					<button class="mui-btn mui-numbox-btn-plus" type="button">+</button>
+					<button class="mui-btn mui-btn-numbox-minus" type="button">-</button>
+					<input id="box" class="mui-input-numbox" type="number" />
+					<button class="mui-btn mui-btn-numbox-plus" type="button">+</button>
 				</div>
 				<button id="btn" class="mui-btn" style="padding: 7px 12px;">取当前值</button>
 				<h5 class="mui-content-padded">在行内</h5> 购买数量:
 				<div class="mui-numbox">
-					<button class="mui-btn mui-numbox-btn-minus" type="button">-</button>
-					<input class="mui-numbox-input" type="number" />
-					<button class="mui-btn mui-numbox-btn-plus" type="button">+</button>
+					<button class="mui-btn mui-btn-numbox-minus" type="button">-</button>
+					<input class="mui-input-numbox" type="number" />
+					<button class="mui-btn mui-btn-numbox-plus" type="button">+</button>
 				</div>
 				<h5 class="mui-content-padded">在表单中</h5>
 				<div class="mui-card">
@@ -73,37 +73,41 @@
 						<div class="mui-input-row">
 							<label>数字框一</label>
 							<div class="mui-numbox">
-								<button class="mui-btn mui-numbox-btn-minus" type="button">-</button>
-								<input class="mui-numbox-input" type="number" />
-								<button class="mui-btn mui-numbox-btn-plus" type="button">+</button>
+								<button class="mui-btn mui-btn-numbox-minus" type="button">-</button>
+								<input class="mui-input-numbox" type="number" />
+								<button class="mui-btn mui-btn-numbox-plus" type="button">+</button>
 							</div>
 						</div>
 						<div class="mui-input-row">
 							<label>数字框二</label>
 							<div class="mui-numbox">
-								<button class="mui-btn mui-numbox-btn-minus" type="button">-</button>
-								<input class="mui-numbox-input" type="number" />
-								<button class="mui-btn mui-numbox-btn-plus" type="button">+</button>
+								<button class="mui-btn mui-btn-numbox-minus" type="button">-</button>
+								<input class="mui-input-numbox" type="number" />
+								<button class="mui-btn mui-btn-numbox-plus" type="button">+</button>
 							</div>
 						</div>
 					</form>
 				</div>
 				<h5 class="mui-content-padded">通过样式定义大小(220x60)</h5>
 				<div class="mui-numbox" style="width: 220px;height: 60px;">
-					<button class="mui-numbox-btn-minus" type="button">-</button>
-					<input class="mui-numbox-input" type="number" />
-					<button class="mui-numbox-btn-plus" type="button">+</button>
+					<button class="mui-btn-numbox-minus" type="button">-</button>
+					<input class="mui-input-numbox" type="number" />
+					<button class="mui-btn-numbox-plus" type="button">+</button>
 				</div>
 				<br/>
 				<br />
 			</div>
 		</div>
-		<script src="../js/mui.min.js"></script>
-		<script>			
+		<script src="../js/mui.js"></script>
+		<script>
 			mui.init();
 			document.getElementById("btn").addEventListener('tap', function(event) {
 				mui.alert('当前值: ' + document.getElementById("box").value, null, "提示");
 			});
+			var testBox=document.getElementById("test");
+			testBox.addEventListener('change',function(){
+				console.log(testBox.value);
+			});
 		</script>
 	</body>
 

examples/hello-mui/examples/popovers.html

@@ -15,12 +15,21 @@
 		<style>
 			/*跨webview需要手动指定位置*/
 			
-			header.mui-bar {
-				display: none!important;
+			.mui-plus header.mui-bar {
+				display: none!important;
 			}
-			.mui-bar-nav~.mui-content {
+			.mui-plus .mui-bar-nav~.mui-content {
 				padding: 0!important;
 			}
+			
+			.mui-plus .plus{
+				display: inline;
+			}
+			
+			.plus{
+				display: none;
+			}
+			
 			#topPopover {
 				position: fixed;
 				top: 16px;
@@ -51,7 +60,7 @@
 	<body>
 		<header class="mui-bar mui-bar-nav">
 			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
-			<a id="menu" class="mui-action-menu mui-icon mui-icon-bars mui-pull-right"></a>
+			<a id="menu" class="mui-action-menu mui-icon mui-icon-bars mui-pull-right" href="#topPopover"></a>
 			<h1 class="mui-title">popover（弹出菜单）</h1>
 		</header>
 		<footer class="mui-bar mui-bar-footer">
@@ -61,9 +70,9 @@
 			<div class="mui-content-padded">
 				<p>popover（弹出菜单是）mobile App中常见的UI组件，在用户点击位置附近弹出悬浮菜单，向用户展示更多信息或提供快捷操作。</p>
 				<p>popover最常用的两个位置：顶部导航栏右侧和底部工具栏右侧； 点击本页右上角的
-					<span class="mui-icon mui-icon-bars"></span> 图标体验，这是一个
+					<span class="mui-icon mui-icon-bars"></span> 图标体验，<span class="plus">这是一个
 					<strong>跨webview</strong>的popover示例，
-					<span class="mui-icon mui-icon-bars"></span>在父webview中，点击后通过自定义事件 通知子webview， 子webview再执行popover的显示隐藏逻辑； 接着点击本页面右下角的“菜单”按钮体验。
+					<span class="mui-icon mui-icon-bars"></span>在父webview中，点击后通过自定义事件 通知子webview， 子webview再执行popover的显示隐藏逻辑； </span>接着点击本页面右下角的“菜单”按钮体验。
 				</p>
 				<p>除了页面顶部导航栏、底部工具栏固定位置之外，其它区域要使用弹出菜单，都要准确计算物理位置，从而实现弹出菜单的绝对定位； mui封装的手势事件中，可以获得点击位置，通过这些位置可实现任意区域的弹出菜单显示，点击如下按钮体验：
 				</p>

examples/hello-mui/examples/setting.html

@@ -213,7 +213,7 @@
 						</ul>
 						<ul class="mui-table-view mui-table-view-chevron">
 							<li class="mui-table-view-cell">
-								<a href="#about" class="mui-navigate-right">关于MUI <i class="mui-pull-right update">V2.6.0</i></a>
+								<a href="#about" class="mui-navigate-right">关于MUI <i class="mui-pull-right update">V2.7.0</i></a>
 							</li>
 						</ul>
 						<ul class="mui-table-view">
@@ -236,32 +236,34 @@
 			</div>
 			<div class="mui-page-content">
 				<div class="mui-scroll-wrapper">
-					<ul class="mui-table-view">
-						<li class="mui-table-view-cell">
-							<a id="head" class="mui-navigate-right">头像
+					<div class="mui-scroll">
+						<ul class="mui-table-view">
+							<li class="mui-table-view-cell">
+								<a id="head" class="mui-navigate-right">头像
 								<span class="mui-pull-right head">
 									<img class="head-img mui-action-preview" id="head-img1" src=""/>
 								</span>
 							</a>
-						</li>
-						<li class="mui-table-view-cell">
-							<a>姓名<span class="mui-pull-right">Hbuilder</span></a>
-						</li>
-						<li class="mui-table-view-cell">
-							<a>HBuilder账号<span class="mui-pull-right">hbuilder@dcloud.io</span></a>
-						</li>
-					</ul>
-					<ul class="mui-table-view">
-						<li class="mui-table-view-cell">
-							<a>QQ号<span class="mui-pull-right">88888888</span></a>
-						</li>
-						<li class="mui-table-view-cell">
-							<a>手机号<span class="mui-pull-right">18601234567</span></a>
-						</li>
-						<li class="mui-table-view-cell">
-							<a>邮箱地址<span class="mui-pull-right">hbuilder@dcloud.io</span></a>
-						</li>
-					</ul>
+							</li>
+							<li class="mui-table-view-cell">
+								<a>姓名<span class="mui-pull-right">Hbuilder</span></a>
+							</li>
+							<li class="mui-table-view-cell">
+								<a>HBuilder账号<span class="mui-pull-right">hbuilder@dcloud.io</span></a>
+							</li>
+						</ul>
+						<ul class="mui-table-view">
+							<li class="mui-table-view-cell">
+								<a>QQ号<span class="mui-pull-right">88888888</span></a>
+							</li>
+							<li class="mui-table-view-cell">
+								<a>手机号<span class="mui-pull-right">18601234567</span></a>
+							</li>
+							<li class="mui-table-view-cell">
+								<a>邮箱地址<span class="mui-pull-right">hbuilder@dcloud.io</span></a>
+							</li>
+						</ul>
+					</div>
 				</div>
 			</div>
 		</div>
@@ -459,13 +461,13 @@
 				<div class="mui-scroll-wrapper">
 					<div class="mui-scroll">
 						<ul class="mui-table-view">
-							<li class="mui-table-view-cell">
+							<li class="mui-table-view-cell mui-plus-visible">
 								<a id="rate" class="mui-navigate-right">评分鼓励</a>
 							</li>
-							<li class="mui-table-view-cell">
+							<li class="mui-table-view-cell mui-plus-visible">
 								<a id="welcome" class="mui-navigate-right">欢迎页</a>
 							</li>
-							<li class="mui-table-view-cell">
+							<li class="mui-table-view-cell mui-plus-visible">
 								<a id="share" class="mui-navigate-right">分享推荐</a>
 							</li>
 							<li class="mui-table-view-cell">
@@ -474,7 +476,7 @@
 							<li class="mui-table-view-cell">
 								<a id="feedback-btn" href="#feedback" class="mui-navigate-right">问题反馈</a>
 							</li>
-							<li class="mui-table-view-cell">
+							<li class="mui-table-view-cell mui-plus-visible">
 								<a id="update" class="mui-navigate-right">检查更新</a>
 							</li>
 						</ul>
@@ -518,14 +520,15 @@
 	<script src="../js/feedback-page.js"></script>
 	<script>
 		mui.init();
-		 //初始化单页view
+		//初始化单页view
 		var viewApi = mui('#app').view({
 			defaultPage: '#setting'
 		});
-		 //初始化单页的区域滚动
+		//初始化单页的区域滚动
 		mui('.mui-scroll-wrapper').scroll();
-		 //分享操作
+		//分享操作
 		var shares = {};
+		
 		mui.plusReady(function() {
 			plus.share.getServices(function(s) {
 				if (s && s.length > 0) {
@@ -537,12 +540,16 @@
 			}, function() {
 				console.log("获取分享服务列表失败");
 			});
+		});
+		
+		setTimeout(function () {
 			defaultImg();
 			setTimeout(function() {
 				initImgPreview();
-			}, 500);
-		});
-		 //分享链接点击事件
+			}, 300);
+		},500);
+		
+		//分享链接点击事件
 		document.getElementById("share").addEventListener('tap', function() {
 			var ids = [{
 					id: "weixin",
@@ -594,25 +601,25 @@
 		});
 
 		function shareMessage(share, ex) {
-				var msg = {
-					extra: {
-						scene: ex
-					}
-				};
-				msg.href = "http://www.dcloud.io/hellomui/";
-				msg.title = "最接近原生APP体验的高性能前端框架";
-				msg.content = "我正在体验HelloMUI，果然很流畅，基本看不出和原生App的差距";
-				if (~share.id.indexOf('weibo')) {
-					msg.content += "；体验地址：http://www.dcloud.io/hellomui/";
+			var msg = {
+				extra: {
+					scene: ex
 				}
-				msg.thumbs = ["_www/images/logo.png"];
-				share.send(msg, function() {
-					console.log("分享到\"" + share.description + "\"成功！ ");
-				}, function(e) {
-					console.log("分享到\"" + share.description + "\"失败: " + e.code + " - " + e.message);
-				});
-			}
-			//去评分
+			};
+			msg.href = "http://www.dcloud.io/hellomui/";
+			msg.title = "最接近原生APP体验的高性能前端框架";
+			msg.content = "我正在体验HelloMUI，果然很流畅，基本看不出和原生App的差距";
+			if (~share.id.indexOf('weibo')) {
+				msg.content += "；体验地址：http://www.dcloud.io/hellomui/";
+			}
+			msg.thumbs = ["_www/images/logo.png"];
+			share.send(msg, function() {
+				console.log("分享到\"" + share.description + "\"成功！ ");
+			}, function(e) {
+				console.log("分享到\"" + share.description + "\"失败: " + e.code + " - " + e.message);
+			});
+		}
+		//去评分
 		document.getElementById("rate").addEventListener('tap', function() {
 			if (mui.os.ios) {
 				location.href = 'https://itunes.apple.com/WebObjects/MZStore.woa/wa/viewContentsUserReviews?id=682211190&pageNumber=0&sortOrdering=2&type=&mt=8';
@@ -624,16 +631,21 @@
 				}, "com.tencent.android.qqdownloader");
 			}
 		});
-		 //客服电话
+		//客服电话
 		document.getElementById("tel").addEventListener('tap', function() {
-			plus.device.dial("114");
+			if(mui.os.plus){
+				plus.device.dial("114");
+			}else{
+				location.href = 'tel:114';
+			}
+			
 		});
-		 //		//意见反馈
-		 //		document.getElementById("quest").addEventListener('tap', function() {
-		 //			
-		 //		});
-		 //		
-		 //检查更新
+		//		//意见反馈
+		//		document.getElementById("quest").addEventListener('tap', function() {
+		//			
+		//		});
+		//		
+		//检查更新
 		document.getElementById("update").addEventListener('tap', function() {
 			var server = "http://www.dcloud.io/check/update"; //获取升级描述文件服务器地址
 			mui.getJSON(server, {
@@ -678,31 +690,34 @@
 				//				console.log(e.detail.page.id + ' back');
 			});
 		})(mui);
-		 //更换头像
+		//更换头像
 		mui(".mui-table-view-cell").on("tap", "#head", function(e) {
-			var a = [{
-				title: "拍照"
-			}, {
-				title: "从手机相册选择"
-			}];
-			plus.nativeUI.actionSheet({
-				title: "修改头像",
-				cancel: "取消",
-				buttons: a
-			}, function(b) {
-				switch (b.index) {
-					case 0:
-						break;
-					case 1:
-						getImage();
-						break;
-					case 2:
-						galleryImg();
-						break;
-					default:
-						break
-				}
-			})
+			if(mui.os.plus){
+				var a = [{
+					title: "拍照"
+				}, {
+					title: "从手机相册选择"
+				}];
+				plus.nativeUI.actionSheet({
+					title: "修改头像",
+					cancel: "取消",
+					buttons: a
+				}, function(b) {
+					switch (b.index) {
+						case 0:
+							break;
+						case 1:
+							getImage();
+							break;
+						case 2:
+							galleryImg();
+							break;
+						default:
+							break
+					}
+				})	
+			}
+			
 		});
 
 		function getImage() {
@@ -774,14 +789,20 @@
 		};
 
 		function defaultImg() {
-			plus.io.resolveLocalFileSystemURL("_doc/head.jpg", function(entry) {
-				var s = entry.fullPath + "?version=" + new Date().getTime();;
-				document.getElementById("head-img").src = s;
-				document.getElementById("head-img1").src = s;
-			}, function(e) {
+			if(mui.os.plus){
+				plus.io.resolveLocalFileSystemURL("_doc/head.jpg", function(entry) {
+					var s = entry.fullPath + "?version=" + new Date().getTime();;
+					document.getElementById("head-img").src = s;
+					document.getElementById("head-img1").src = s;
+				}, function(e) {
+					document.getElementById("head-img").src = '../images/logo.png';
+					document.getElementById("head-img1").src = '../images/logo.png';
+				})
+			}else{
 				document.getElementById("head-img").src = '../images/logo.png';
 				document.getElementById("head-img1").src = '../images/logo.png';
-			})
+			}
+			
 		}
 		document.getElementById("head-img1").addEventListener('tap', function(e) {
 			e.stopPropagation();

examples/hello-mui/examples/tab-webview-main.html

@@ -79,9 +79,11 @@
 				//更换标题
 				title.innerHTML = this.querySelector('.mui-tab-label').innerHTML;
 				//显示目标选项卡
+				//若为iOS平台或非首次显示，则直接显示
 				if(mui.os.ios||aniShow[targetTab]){
 					plus.webview.show(targetTab);
 				}else{
+					//否则，使用fade-in动画，且保存变量
 					var temp = {};
 					temp[targetTab] = "true";
 					mui.extend(aniShow,temp);

examples/hello-mui/examples/tab-with-viewpagerindicator.html

@@ -11,7 +11,7 @@
 		<!--标准mui.css-->
 		<link rel="stylesheet" href="../css/mui.min.css">
 		<!--App自定义的css-->
-		<link rel="stylesheet" type="text/css" href="../css/app.css"/>
+		<link rel="stylesheet" type="text/css" href="../css/app.css" />
 	</head>
 
 	<body>

examples/hello-mui/index.html

@@ -13,7 +13,7 @@
 
 	<body>
 		<header class="mui-bar mui-bar-nav">
-			<a class="mui-icon mui-icon-bars mui-pull-left"></a>
+			<a class="mui-icon mui-icon-bars mui-pull-left mui-plus-visible"></a>
 			<a id="info" class="mui-icon mui-icon-info-filled mui-pull-right" style="color: #999;"></a>
 			<h1 class="mui-title">Hello mui</h1>
 		</header>
@@ -119,7 +119,7 @@
 					}, 300);
 				}
 			};
-			 //点击左上角侧滑图标，打开侧滑菜单；
+			//点击左上角侧滑图标，打开侧滑菜单；
 			document.querySelector('.mui-icon-bars').addEventListener('tap', function(e) {
 				if (showMenu) {
 					closeMenu();
@@ -127,18 +127,18 @@
 					openMenu();
 				}
 			});
-			 //敲击顶部导航，内容区回到顶部
+			//敲击顶部导航，内容区回到顶部
 			document.querySelector('header').addEventListener('doubletap', function() {
 				main.children()[0].evalJS('mui.scrollTo(0, 100)');
 			});
-			 //主界面向右滑动，若菜单未显示，则显示菜单；否则不做任何操作
+			//主界面向右滑动，若菜单未显示，则显示菜单；否则不做任何操作
 			window.addEventListener("swiperight", openMenu);
-			 //主界面向左滑动，若菜单已显示，则关闭菜单；否则，不做任何操作；
+			//主界面向左滑动，若菜单已显示，则关闭菜单；否则，不做任何操作；
 			window.addEventListener("swipeleft", closeMenu);
-			 //侧滑菜单触发关闭菜单命令
+			//侧滑菜单触发关闭菜单命令
 			window.addEventListener("menu:close", closeMenu);
 			window.addEventListener("menu:open", openMenu);
-			 //重写mui.menu方法，Android版本menu按键按下可自动打开、关闭侧滑菜单；
+			//重写mui.menu方法，Android版本menu按键按下可自动打开、关闭侧滑菜单；
 			mui.menu = function() {
 					if (showMenu) {
 						closeMenu();
@@ -150,6 +150,17 @@
 			var subWebview = null,
 				template = null;
 			document.getElementById('info').addEventListener('tap', function() {
+				if (!mui.os.plus) {
+					mui.openWindow({
+						url: "examples/info.html",
+						id: "info",
+						show: {
+							aniShow: 'zoom-fade-out',
+							duration: 300
+						}
+					});
+					return;
+				}
 				if (subWebview == null) {
 					//获取共用父窗体
 					template = plus.webview.getWebviewById("default-main");
@@ -164,9 +175,17 @@
 					});
 					template.show('slide-in-right', 150);
 				}
+				//				mui.openWindow({
+				//					url:"examples/info.html",
+				//					id:"info",
+				//					show:{
+				//						aniShow:'zoom-fade-out',
+				//						duration:300
+				//					}
+				//				});
 			});
-			 //首页返回键处理
-			 //处理逻辑：1秒内，连续两次按返回键，则退出应用；
+			//首页返回键处理
+			//处理逻辑：1秒内，连续两次按返回键，则退出应用；
 			var first = null;
 			mui.back = function() {
 				if (showMenu) {

examples/hello-mui/js/mui.js

 /*!
  * =====================================================
- * Mui v2.6.0 (http://dev.dcloud.net.cn/mui)
+ * Mui v2.7.0 (http://dev.dcloud.net.cn/mui)
  * =====================================================
  */
 /**
@@ -524,10 +524,29 @@ var mui = (function(document, undefined) {
 				break;
 			}
 		}
-
+	});
+	window.addEventListener('click', function(event) { //解决touch与click的target不一致的问题(比如链接边缘点击时，touch的target为html，而click的target为A)
+		var target = event.target;
+		var isFound = false;
+		for (; target && target !== document; target = target.parentNode) {
+			if (target.tagName === 'A') {
+				$.each($.targetHandles, function(index, targetHandle) {
+					var name = targetHandle.name;
+					if (targetHandle.hasOwnProperty('handle')) {
+						if (targetHandle.handle(event, target)) {
+							isFound = true;
+							event.preventDefault();
+							return false;
+						}
+					}
+				});
+				if (isFound) {
+					break;
+				}
+			}
+		}
 	});
 })(mui, window, document);
-
 /**
  * fixed trim
  * @param {type} undefined
@@ -1434,7 +1453,7 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 	//fixed hashchange(android)
 	window.addEventListener($.EVENT_CLICK, function(e) {
 		//TODO 应该判断当前target是不是在targets.popover内部，而不是非要相等
-		if (($.targets.popover && e.target === $.targets.popover) || ($.targets.tab) || $.targets.offcanvas || $.targets.modal) {
+		if (($.os.android || $.os.ios) && (($.targets.popover && e.target === $.targets.popover) || ($.targets.tab) || $.targets.offcanvas || $.targets.modal)) {
 			e.preventDefault();
 		}
 	}, true);
@@ -1472,6 +1491,7 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 				break;
 			case $.EVENT_END:
 			case $.EVENT_CANCEL:
+				touch.flick = false;
 				if (session.flickStart && options.flickMaxTime > (now - flickStartTime) && touch.distance > options.flickMinDistince) {
 					touch.flick = true;
 					touch.flickTime = now - flickStartTime;
@@ -1508,6 +1528,7 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 		var session = $.gestures.session;
 		if (event.type === $.EVENT_END || event.type === $.EVENT_CANCEL) {
 			var options = this.options;
+			touch.swipe = false;
 			//TODO 后续根据velocity计算
 			if (touch.direction && options.swipeMaxTime > touch.deltaTime && touch.distance > options.swipeMinDistince) {
 				touch.swipe = true;
@@ -1848,6 +1869,40 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 	$.addInit = function(init) {
 		return $.addAction('inits', init);
 	};
+	/**
+	 * 处理html5版本subpages 
+	 */
+	$.addInit({
+		name: 'iframe',
+		index: 100,
+		handle: function() {
+			var options = $.options;
+			var subpages = options.subpages || [];
+			if (!$.os.plus && subpages.length) {
+				//暂时只处理单个subpage。后续可以考虑支持多个subpage
+				createIframe(subpages[0]);
+			}
+		}
+	});
+	var createIframe = function(options) {
+		var wrapper = document.createElement('div');
+		wrapper.className = 'mui-iframe-wrapper';
+		var styles = options.styles || {};
+		if (typeof styles.top !== 'string') {
+			styles.top = '0px';
+		}
+		if (typeof styles.bottom !== 'string') {
+			styles.bottom = '0px';
+		}
+		wrapper.style.top = styles.top;
+		wrapper.style.bottom = styles.bottom;
+		var iframe = document.createElement('iframe');
+		iframe.src = options.url;
+		iframe.id = options.id || options.url;
+		iframe.name = iframe.id;
+		wrapper.appendChild(iframe);
+		document.body.appendChild(wrapper);
+	};
 	$(function() {
 		var classList = document.body.classList;
 		var os = [];
@@ -1923,7 +1978,10 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 	 * @returns {Object}
 	 */
 	$.waitingOptions = function(options) {
-		return $.extend(true,{},{autoShow: true,title: ''}, options);
+		return $.extend(true, {}, {
+			autoShow: true,
+			title: ''
+		}, options);
 	};
 	/**
 	 * 窗口显示配置
@@ -1931,7 +1989,7 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 	 * @returns {Object}
 	 */
 	$.showOptions = function(options) {
-		return $.extend(true,{},defaultShow, options);
+		return $.extend(true, {}, defaultShow, options);
 	};
 	/**
 	 * 窗口默认配置
@@ -2031,10 +2089,6 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 	 * @param {object} options 可选:参数,等待,窗口,显示配置{params:{},waiting:{},styles:{},show:{}}
 	 */
 	$.openWindow = function(url, id, options) {
-
-		if (!window.plus) {
-			return;
-		}
 		if (typeof url === 'object') {
 			options = url;
 			url = options.url;
@@ -2047,19 +2101,29 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 				id = id || url;
 			}
 		}
+		if (!$.os.plus) {
+			window.top.location.href = url;
+			return;
+		}
+		if (!window.plus) {
+			return;
+		}
+
 		options = options || {};
 		var params = options.params || {};
-		var webview = null,webviewCache = null, nShow, nWaiting;
+		var webview = null,
+			webviewCache = null,
+			nShow, nWaiting;
 
-		if($.webviews[id]){
+		if ($.webviews[id]) {
 			webviewCache = $.webviews[id];
 			//webview真实存在，才能获取
-			if(plus.webview.getWebviewById(id)){
+			if (plus.webview.getWebviewById(id)) {
 				webview = webviewCache.webview;
 			}
 		}
 
-		if (webviewCache&&webview) { //已缓存
+		if (webviewCache && webview) { //已缓存
 			//每次show都需要传递动画参数；
 			//预加载的动画参数优先级：openWindow配置>preloadPages配置>mui默认配置；
 			nShow = webviewCache.show;
@@ -2320,20 +2384,21 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 					}
 				});
 			} else {
-				if (subpages.length > 0) {
-					var err = document.createElement('div');
-					err.className = 'mui-error';
-					//文字描述
-					var span = document.createElement('span');
-					span.innerHTML = '在该浏览器下，不支持创建子页面，具体参考';
-					err.appendChild(span);
-					var a = document.createElement('a');
-					a.innerHTML = '"mui框架适用场景"';
-					a.href = 'http://ask.dcloud.net.cn/article/113';
-					err.appendChild(a);
-					document.body.appendChild(err);
-					console.log('在该浏览器下，不支持创建子页面');
-				}
+				//已支持iframe嵌入
+				//				if (subpages.length > 0) {
+				//					var err = document.createElement('div');
+				//					err.className = 'mui-error';
+				//					//文字描述
+				//					var span = document.createElement('span');
+				//					span.innerHTML = '在该浏览器下，不支持创建子页面，具体参考';
+				//					err.appendChild(span);
+				//					var a = document.createElement('a');
+				//					a.innerHTML = '"mui框架适用场景"';
+				//					a.href = 'http://ask.dcloud.net.cn/article/113';
+				//					err.appendChild(a);
+				//					document.body.appendChild(err);
+				//					console.log('在该浏览器下，不支持创建子页面');
+				//				}
 
 			}
 
@@ -2351,6 +2416,15 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 
 		});
 	});
+	$.supportStatusbarOffset = function() {
+		return $.os.plus && $.os.ios && parseFloat($.os.version) >= 7;
+	};
+	$.ready(function() {
+		//标识当前环境支持statusbar
+		if ($.supportStatusbarOffset()) {
+			document.body.classList.add('mui-statusbar');
+		}
+	});
 })(mui);
 /**
  * mui back
@@ -2715,7 +2789,7 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 		if (settings.cache === false || ((!options || options.cache !== true) && ('script' === dataType))) {
 			settings.url = appendQuery(settings.url, '_=' + $.now());
 		}
-		var mime = settings.accepts[dataType];
+		var mime = settings.accepts[dataType.toLowerCase()];
 		var headers = {};
 		var setHeader = function(name, value) {
 			headers[name.toLowerCase()] = [name, value];
@@ -3025,9 +3099,10 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 				scrollY: true,
 				scrollX: false,
 				indicators: true,
-				deceleration:0.003,
+				deceleration: 0.003,
 				down: {
 					height: 50,
+					contentinit: '下拉可以刷新',
 					contentdown: '下拉可以刷新',
 					contentover: '释放立即刷新',
 					contentrefresh: '正在刷新...'
@@ -3035,6 +3110,7 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 				up: {
 					height: 50,
 					auto: false,
+					contentinit: '上拉显示更多',
 					contentdown: '上拉显示更多',
 					contentrefresh: '正在加载...',
 					contentnomore: '没有更多数据了',
@@ -3088,7 +3164,7 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 		_createPocket: function(clazz, options, iconClass) {
 			var pocket = document.createElement('div');
 			pocket.className = clazz;
-			pocket.innerHTML = pocketHtml.replace('{contentrefresh}', options.contentrefresh).replace('{icon}', iconClass);
+			pocket.innerHTML = pocketHtml.replace('{contentrefresh}', options.contentinit).replace('{icon}', iconClass);
 			return pocket;
 		},
 		_resetPullDownLoading: function() {
@@ -3193,6 +3269,12 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 			fn: function(k) {
 				return Math.sqrt(1 - (--k * k));
 			}
+		},
+		outCirc: {
+			style: 'cubic-bezier(0.075, 0.82, 0.165, 1)'
+		},
+		outCubic: {
+			style: 'cubic-bezier(0.165, 0.84, 0.44, 1)'
 		}
 	}
 	var Scroll = $.Class.extend({
@@ -3207,6 +3289,7 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 				scrollX: false, //是否横向滚动
 				startX: 0, //初始化时滚动至x
 				startY: 0, //初始化时滚动至y
+
 				indicators: true, //是否显示滚动条
 				stopPropagation: false,
 				hardwareAccelerated: true,
@@ -3216,11 +3299,16 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 				},
 				momentum: true,
 
+				snapX: 0.5, //横向切换距离(以当前容器宽度为基准)
 				snap: false, //图片轮播，拖拽式选项卡
 
 				bounce: true, //是否启用回弹
-				bounceTime: 300, //回弹动画时间
-				bounceEasing: ease.circular.style, //回弹动画曲线
+				bounceTime: 500, //回弹动画时间
+				bounceEasing: ease.outCirc, //回弹动画曲线
+
+				scrollTime: 500,
+				scrollEasing: ease.outCubic, //轮播动画曲线
+
 
 				directionLockThreshold: 5,
 
@@ -3297,7 +3385,9 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 			var m = 0;
 			var n = -1;
 			var x = 0;
-			var cx = 0;
+			var leftX = 0;
+			var rightX = 0;
+			var snapX = 0;
 			for (var i = 0; i < length; i++) {
 				var snap = snaps[i];
 				var offsetLeft = snap.offsetLeft;
@@ -3310,10 +3400,13 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 					this.pages[m] = [];
 				}
 				x = this._getSnapX(offsetLeft);
-				cx = x - Math.round((offsetWidth) / 2);
+				snapX = Math.round((offsetWidth) * this.options.snapX);
+				leftX = x - snapX;
+				rightX = x - offsetWidth + snapX;
 				this.pages[m][n] = {
 					x: x,
-					cx: cx,
+					leftX: leftX,
+					rightX: rightX,
 					pageX: m,
 					element: snap
 				}
@@ -3338,7 +3431,7 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 					this.snaps[i].classList.remove(CLASS_ACTIVE);
 				}
 			}
-			this.scrollTo(this.currentPage.x, 0, this.options.bounceTime);
+			this.scrollTo(this.currentPage.x, 0, this.options.scrollTime);
 		},
 		_nearestSnap: function(x) {
 			if (!this.pages.length) {
@@ -3349,15 +3442,14 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 			}
 			var i = 0;
 			var length = this.pages.length;
-
 			if (x > 0) {
 				x = 0;
 			} else if (x < this.maxScrollX) {
 				x = this.maxScrollX;
 			}
-
 			for (; i < length; i++) {
-				if (x >= this.pages[i][0].cx) {
+				var nearestX = this.direction === 'left' ? this.pages[i][0].leftX : this.pages[i][0].rightX;
+				if (x >= nearestX) {
 					return this.pages[i][0];
 				}
 			}
@@ -3573,7 +3665,7 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 			if (!this.requestAnimationFrame) {
 				this._updateTranslate();
 			}
-
+			this.direction = detail.deltaX > 0 ? 'right' : 'left';
 			this.moved = true;
 			this.x = newX;
 			this.y = newY;
@@ -3873,7 +3965,7 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 			if (x == this.x && y == this.y) {
 				return false;
 			}
-			this.scrollTo(x, y, time, this.options.bounceEasing);
+			this.scrollTo(x, y, time, this.options.scrollEasing);
 
 			return true;
 		},
@@ -3898,7 +3990,7 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 
 		},
 		scrollToBottom: function(time, easing) {
-			time = time || this.options.bounceTime;
+			time = time || this.options.scrollTime;
 			this.scrollTo(0, this.maxScrollY, time, easing);
 		},
 		gotoPage: function(index) {
@@ -4275,7 +4367,7 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 				scrollY: false,
 				scrollX: true,
 				indicators: false,
-				bounceTime: 200,
+				scrollTime: 1000,
 				startX: false,
 				slideTime: 0, //滑动动画时间
 				snap: SELECTOR_SLIDER_ITEM
@@ -4550,7 +4642,7 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 		},
 		_gotoItem: function(slideNumber, time) {
 			this.currentPage = this._getPage(slideNumber, true); //此处传true。可保证程序切换时，动画与人手操作一致(第一张，最后一张的切换动画)
-			this.scrollTo(this.currentPage.x, 0, time, this.options.bounceEasing);
+			this.scrollTo(this.currentPage.x, 0, time, this.options.scrollEasing);
 			if (time === 0) {
 				$.trigger(this.wrapper, 'scrollend', this);
 			}
@@ -4571,17 +4663,17 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 				this.x = this.maxScrollX;
 			}
 			this.currentPage = this._nearestSnap(this.x);
-			this.scrollTo(this.currentPage.x, 0, time);
+			this.scrollTo(this.currentPage.x, 0, time, this.options.scrollEasing);
 			return true;
 		},
 		gotoItem: function(slideNumber, time) {
-			this._gotoItem(slideNumber, typeof time === 'undefined' ? this.options.bounceTime : time);
+			this._gotoItem(slideNumber, typeof time === 'undefined' ? this.options.scrollTime : time);
 		},
 		nextItem: function() {
-			this._gotoItem(this.slideNumber + 1, this.options.bounceTime);
+			this._gotoItem(this.slideNumber + 1, this.options.scrollTime);
 		},
 		prevItem: function() {
-			this._gotoItem(this.slideNumber - 1, this.options.bounceTime);
+			this._gotoItem(this.slideNumber - 1, this.options.scrollTime);
 		},
 		getSlideNumber: function() {
 			return this.slideNumber || 0;
@@ -4773,15 +4865,22 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 			}
 		},
 		pulldownLoading: function() { //该方法是子页面调用的
+			$.plusReady(function() {
+				plus.webview.currentWebview().setBounce({
+					offset: {
+						top: this.options.down.height + "px"
+					}
+				});
+			}.bind(this));
 			var callback = $.options.pullRefresh.down.callback;
 			callback && callback.call(this);
 		},
-		_pulldownLoading: function() { //该方法是子页面调用的
-			var self = this;
-			$.plusReady(function() {
-				plus.webview.getWebviewById(self.options.webviewId).evalJS("mui&&mui.options.pullRefresh.down&&mui.options.pullRefresh.down.callback()");
-			});
-		},
+		//		_pulldownLoading: function() { //该方法是子页面调用的
+		//			var self = this;
+		//			$.plusReady(function() {
+		//				plus.webview.getWebviewById(self.options.webviewId).evalJS("mui&&mui.options.pullRefresh.down&&mui.options.pullRefresh.down.callback()");
+		//			});
+		//		},
 		endPulldownToRefresh: function() { //该方法是子页面调用的
 			var webview = plus.webview.currentWebview();
 			webview.parent().evalJS("mui&&mui(document.querySelector('.mui-content')).pullRefresh('" + JSON.stringify({
@@ -4894,7 +4993,7 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 			pullRefreshApi = $.data[id];
 		}
 		if (options.down && options.down.auto) { //如果设置了auto，则自动下拉一次
-			pullRefreshApi._pulldownLoading(); //parent webview
+			pullRefreshApi.pulldownLoading(); //parent webview
 		} else if (options.up && options.up.auto) { //如果设置了auto，则自动上拉一次
 			pullRefreshApi.pullupLoading();
 		}
@@ -5094,21 +5193,23 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 								this._dispatchEvent(); //此处不触发webkitTransitionEnd,所以手动dispatch
 								return;
 							}
-							if (ratio > 0 && ratio < 0.5 && direction === 'right') {
-								this.openPercentage(0);
-							} else if (ratio > 0.5 && direction === 'left') {
+							if (direction === 'right' && ratio >= 0 && (ratio >= 0.5 || detail.swipe)) { //右滑打开
 								this.openPercentage(100);
-							} else if (ratio < 0 && ratio > -0.5 && direction === 'left') {
+							} else if (direction === 'right' && ratio < 0 && (ratio > -0.5 || detail.swipe)) { //右滑关闭
 								this.openPercentage(0);
-							} else if (direction === 'right' && ratio < 0 && ratio > -0.5) {
+							} else if (direction === 'right' && ratio > 0 && ratio < 0.5) { //右滑还原关闭
 								this.openPercentage(0);
-							} else if (ratio < 0.5 && direction === 'right') {
+							} else if (direction === 'right' && ratio < 0.5) { //右滑还原打开
 								this.openPercentage(-100);
-							} else if (direction === 'right' && ratio >= 0 && (ratio >= 0.5 || detail.flick)) {
-								this.openPercentage(100);
-							} else if (direction === 'left' && ratio <= 0 && (ratio <= -0.5 || detail.flick)) {
+							} else if (direction === 'left' && ratio <= 0 && (ratio <= -0.5 || detail.swipe)) { //左滑打开
 								this.openPercentage(-100);
-							} else {
+							} else if (direction === 'left' && ratio > 0 && (ratio <= 0.5 || detail.swipe)) { //左滑关闭
+								this.openPercentage(0);
+							} else if (direction === 'left' && ratio < 0 && ratio >= -0.5) { //左滑还原关闭
+								this.openPercentage(0);
+							} else if (direction === 'left' && ratio > 0.5) { //左滑还原打开
+								this.openPercentage(100);
+							} else { //默认关闭
 								this.openPercentage(0);
 							}
 							if (ratio === 1 || ratio === -1) { //此处不触发webkitTransitionEnd,所以手动dispatch
@@ -5120,24 +5221,22 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 							} else {
 								ratio = (this.offCanvasLeftWidth && (x / this.offCanvasLeftWidth)) || 0;
 							}
-							if (ratio >= 0.5 && direction === 'left') {
+							if (direction === 'right' && ratio <= 0 && (ratio >= -0.5 || detail.swipe)) { //右滑打开
+								this.openPercentage(100);
+							} else if (direction === 'right' && ratio > 0 && (ratio >= 0.5 || detail.swipe)) { //右滑关闭
 								this.openPercentage(0);
-							} else if (ratio > 0 && ratio <= 0.5 && direction === 'left') {
-								this.openPercentage(-100);
-							} else if (ratio >= 0.5 && direction === 'right') {
+							} else if (direction === 'right' && ratio <= -0.5) { //右滑还原关闭
 								this.openPercentage(0);
-							} else if (ratio >= -0.5 && ratio < 0 && direction === 'left') {
-								this.openPercentage(100);
-							} else if (ratio > 0 && ratio <= 0.5 && direction === 'right') {
+							} else if (direction === 'right' && ratio > 0 && ratio <= 0.5) { //右滑还原打开
+								this.openPercentage(-100);
+							} else if (direction === 'left' && ratio >= 0 && (ratio <= 0.5 || detail.swipe)) { //左滑打开
 								this.openPercentage(-100);
-							} else if (ratio <= -0.5 && direction === 'right') {
+							} else if (direction === 'left' && ratio < 0 && (ratio <= -0.5 || detail.swipe)) { //左滑关闭
 								this.openPercentage(0);
-							} else if (ratio >= -0.5 && direction === 'right') {
-								this.openPercentage(100);
-							} else if (ratio <= -0.5 && direction === 'left') {
+							} else if (direction === 'left' && ratio >= 0.5) { //左滑还原关闭
 								this.openPercentage(0);
-							} else if (ratio >= -0.5 && direction === 'left') {
-								this.openPercentage(-100);
+							} else if (direction === 'left' && ratio >= -0.5 && ratio < 0) { //左滑还原打开
+								this.openPercentage(100);
 							} else {
 								this.openPercentage(0);
 							}
@@ -5207,7 +5306,6 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 				}
 				this.classList[percentage !== 0 ? 'add' : 'remove'](CLASS_ACTIVE);
 			}
-
 		},
 		updateTranslate: function(x) {
 			if (x !== this.lastTranslateX) {
@@ -5644,7 +5742,10 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 
 	});
 
-	var togglePopover = function(popover, anchor) {
+	var togglePopover = function(popover, anchor, state) {
+		if ((state === 'show' && popover.classList.contains(CLASS_ACTIVE)) || (state === 'hide' && !popover.classList.contains(CLASS_ACTIVE))) {
+			return;
+		}
 		removeBackdropTimer && removeBackdropTimer.cancel(); //取消remove的timer
 		//remove一遍，以免来回快速切换，导致webkitTransitionEnd不触发，无法remove
 		popover.removeEventListener('webkitTransitionEnd', onPopoverShown);
@@ -5814,7 +5915,7 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 		this.each(function() {
 			$.targets._popover = this;
 			if (args[0] === 'show' || args[0] === 'hide' || args[0] === 'toggle') {
-				togglePopover(this, args[1]);
+				togglePopover(this, args[1], args[0]);
 			}
 		});
 	};
@@ -5997,6 +6098,7 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 		}
 	};
 	Toggle.prototype.start = function(e) {
+		this.handle.style.webkitTransitionDuration = this.element.style.webkitTransitionDuration = '.2s';
 		this.classList.add(CLASS_DRAGGING);
 		if (this.toggleWidth === 0 || this.handleWidth === 0) { //当switch处于隐藏状态时，width为0，需要重新初始化
 			this.init();
@@ -6034,8 +6136,13 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 			this.toggle();
 		}
 	};
-	Toggle.prototype.toggle = function() {
+	Toggle.prototype.toggle = function(animate) {
 		var classList = this.classList;
+		if (animate === false) {
+			this.handle.style.webkitTransitionDuration = this.element.style.webkitTransitionDuration = '0s';
+		} else {
+			this.handle.style.webkitTransitionDuration = this.element.style.webkitTransitionDuration = '.2s';
+		}
 		if (classList.contains(CLASS_ACTIVE)) {
 			classList.remove(CLASS_ACTIVE);
 			this.handle.style.webkitTransform = 'translate(0,0)';
@@ -6186,7 +6293,7 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 	};
 	var setTranslate = function(element, x) {
 		if (element) {
-			element.style.webkitTransform = 'translate3d(' + x + 'px,0,0)';
+			element.style.webkitTransform = 'translate(' + x + 'px,0)';
 		}
 	};
 
@@ -6757,6 +6864,7 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 	var CLASS_ICON_CLEAR = 'mui-icon-clear';
 	var CLASS_ICON_SPEECH = 'mui-icon-speech';
 	var CLASS_ICON_SEARCH = 'mui-icon-search';
+	var CLASS_ICON_PASSWORD = 'mui-icon-eye';
 	var CLASS_INPUT_ROW = 'mui-input-row';
 	var CLASS_PLACEHOLDER = 'mui-placeholder';
 	var CLASS_TOOLTIP = 'mui-tooltip';
@@ -6764,6 +6872,7 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 	var CLASS_FOCUSIN = 'mui-focusin';
 	var SELECTOR_ICON_CLOSE = '.' + CLASS_ICON_CLEAR;
 	var SELECTOR_ICON_SPEECH = '.' + CLASS_ICON_SPEECH;
+	var SELECTOR_ICON_PASSWORD = '.' + CLASS_ICON_PASSWORD;
 	var SELECTOR_PLACEHOLDER = '.' + CLASS_PLACEHOLDER;
 	var SELECTOR_TOOLTIP = '.' + CLASS_TOOLTIP;
 
@@ -6796,6 +6905,10 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 				this.searchActionClass = CLASS_PLACEHOLDER;
 				this.searchActionSelector = SELECTOR_PLACEHOLDER;
 			}
+			if (~this.options.actions.indexOf('password')) {
+				this.passwordActionClass = CLASS_ICON + ' ' + CLASS_ICON_PASSWORD;
+				this.passwordActionSelector = SELECTOR_ICON_PASSWORD;
+			}
 		}
 		this.init();
 	};
@@ -6830,7 +6943,12 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 					self.clearAction.addEventListener('tap', function(event) {
 						self.clearActionClick(event);
 					});
-
+				}
+				if (self.passwordActionClass) {
+					self.passwordAction = self.createAction(row, self.passwordActionClass, self.passwordActionSelector);
+					self.passwordAction.addEventListener('tap', function(event) {
+						self.passwordActionClick(event);
+					});
 				}
 			}
 		}
@@ -6918,6 +7036,15 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 			this.element.setAttribute('placeholder', text);
 		}
 	};
+	Input.prototype.passwordActionClick = function(event) {
+		if (this.element.type === 'text') {
+			this.element.type = 'password';
+		} else {
+			this.element.type = 'text';
+		}
+		this.passwordAction.classList.toggle('mui-active');
+		event.preventDefault();
+	};
 	Input.prototype.clearActionClick = function(event) {
 		var self = this;
 		self.element.value = '';
@@ -6969,6 +7096,9 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 				if (classList.contains('mui-input-speech')) {
 					actions.push('speech');
 				}
+				if (classList.contains('mui-input-password')) {
+					actions.push('password');
+				}
 				if (this.type === 'search' && row.classList.contains('mui-search')) {
 					actions.push('search');
 				}
@@ -7006,9 +7136,9 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 	var tapEventName = touchSupport ? 'tap' : 'click';
 	var changeEventName = 'change';
 	var holderClassName = 'mui-numbox';
-	var plusClassName = 'mui-numbox-btn-plus';
-	var minusClassName = 'mui-numbox-btn-minus';
-	var inputClassName = 'mui-numbox-input';
+	var plusClassName = 'mui-btn-numbox-plus' + "," + "mui-numbox-btn-plus";
+	var minusClassName = 'mui-btn-numbox-minus' + "," + "mui-numbox-btn-minus";
+	var inputClassName = 'mui-input-numbox' + "," + "mui-numbox-input";
 
 	var Numbox = $.Numbox = $.Class.extend({
 		/**
@@ -7099,7 +7229,9 @@ Function.prototype.bind = Function.prototype.bind || function(to) {
 		var instanceArray = [];
 		//遍历选择的元素
 		this.each(function(i, element) {
-			if (element.numbox) return;
+			if (element.numbox) {
+				return;
+			}
 			if (options) {
 				element.numbox = new Numbox(element, options);
 			} else {

examples/hello-mui/list.html

@@ -11,7 +11,6 @@
 		<style type="text/css">
 			#list {
 				/*避免导航边框和列表背景边框重叠，看起来像两条边框似得；*/
-				
 				margin-top: -1px;
 			}
 		</style>
@@ -35,7 +34,7 @@
 								H5模式actionsheet
 							</a>
 						</li>
-						<li class="mui-table-view-cell">
+						<li class="mui-table-view-cell mui-plus-visible">
 							<a class="mui-navigate-right" href="examples/actionsheet-plus.html">
 								原生模式actionsheet
 							</a>
@@ -43,7 +42,7 @@
 					</ul>
 				</li>
 				
-				<li class="mui-table-view-cell">
+				<li class="mui-table-view-cell mui-plus-visible">
 					<a class="mui-navigate-right" href="examples/ajax.html">
 						ajax（网络请求）
 					</a>
@@ -96,7 +95,7 @@
 								H5模式
 							</a>
 						</li>
-						<li class="mui-table-view-cell">
+						<li class="mui-table-view-cell mui-plus-visible">
 							<a class="mui-navigate-right" href="examples/date.html">
 								native模式
 							</a>
@@ -229,12 +228,12 @@
 						off canvas（侧滑导航）
 					</a>
 					<ul class="mui-table-view mui-table-view-chevron">
-						<li class="mui-table-view-cell">
+						<li class="mui-table-view-cell mui-plus-visible">
 							<a class="mui-navigate-right" open-type="common" href="examples/offcanvas-drag-right-plus-main.html">
 								webview模式右滑菜单
 							</a>
 						</li>
-						<li class="mui-table-view-cell">
+						<li class="mui-table-view-cell mui-plus-visible">
 							<a class="mui-navigate-right" open-type="common" href="examples/offcanvas-drag-left-plus-main.html">
 								webview模式左滑菜单
 							</a>
@@ -311,7 +310,7 @@
 								底部选项卡-div模式
 							</a>
 						</li>
-						<li class="mui-table-view-cell">
+						<li class="mui-table-view-cell mui-plus-visible">
 							<a class="mui-navigate-right" open-type="common" href="examples/tab-webview-main.html">
 								底部选项卡-webview模式
 							</a>
@@ -351,7 +350,7 @@
 				</li>
 				
 				<li class="mui-table-view-divider">模板</li>
-				<li class="mui-table-view-cell">
+				<li class="mui-table-view-cell mui-plus-visible">
 					<a class="mui-navigate-right" open-type="common" href="examples/ad.html">
 						advertisement（广告模板）
 					</a>
@@ -361,12 +360,12 @@
 						chart（EChart 图表）
 					</a>
 				</li>
-				<li class="mui-table-view-cell">
+				<li class="mui-table-view-cell mui-plus-visible">
 					<a class="mui-navigate-right" open-type="common" href="examples/clouddb_wilddog.html">
 						cloud DB（云端数据库）
 					</a>
 				</li>
-				<li class="mui-table-view-cell">
+				<li class="mui-table-view-cell mui-plus-visible">
 					<a class="mui-navigate-right" href="examples/im-chat.html">
 						chat（聊天窗口） 
 					</a>
@@ -567,7 +566,7 @@
 						}
 					});
 				} else if (id && ~id.indexOf('.html')) {
-					if (!~id.indexOf('popovers.html')&&mui.os.ios) {
+					if (!mui.os.plus || (!~id.indexOf('popovers.html')&&mui.os.ios)) {
 						mui.openWindow({
 							id: id,
 							url: this.href,

js/input.plugin.js

@@ -10,6 +10,7 @@
 	var CLASS_ICON_CLEAR = $.className('icon-clear');
 	var CLASS_ICON_SPEECH = $.className('icon-speech');
 	var CLASS_ICON_SEARCH = $.className('icon-search');
+	var CLASS_ICON_PASSWORD = $.className('icon-eye');
 	var CLASS_INPUT_ROW = $.className('input-row');
 	var CLASS_PLACEHOLDER = $.className('placeholder');
 	var CLASS_TOOLTIP = $.className('tooltip');
@@ -17,6 +18,7 @@
 	var CLASS_FOCUSIN = $.className('focusin');
 	var SELECTOR_ICON_CLOSE = '.' + CLASS_ICON_CLEAR;
 	var SELECTOR_ICON_SPEECH = '.' + CLASS_ICON_SPEECH;
+	var SELECTOR_ICON_PASSWORD = '.' + CLASS_ICON_PASSWORD;
 	var SELECTOR_PLACEHOLDER = '.' + CLASS_PLACEHOLDER;
 	var SELECTOR_TOOLTIP = '.' + CLASS_TOOLTIP;
 
@@ -49,6 +51,10 @@
 				this.searchActionClass = CLASS_PLACEHOLDER;
 				this.searchActionSelector = SELECTOR_PLACEHOLDER;
 			}
+			if (~this.options.actions.indexOf('password')) {
+				this.passwordActionClass = CLASS_ICON + ' ' + CLASS_ICON_PASSWORD;
+				this.passwordActionSelector = SELECTOR_ICON_PASSWORD;
+			}
 		}
 		this.init();
 	};
@@ -83,7 +89,12 @@
 					self.clearAction.addEventListener('tap', function(event) {
 						self.clearActionClick(event);
 					});
-
+				}
+				if (self.passwordActionClass) {
+					self.passwordAction = self.createAction(row, self.passwordActionClass, self.passwordActionSelector);
+					self.passwordAction.addEventListener('tap', function(event) {
+						self.passwordActionClick(event);
+					});
 				}
 			}
 		}
@@ -171,6 +182,15 @@
 			this.element.setAttribute('placeholder', text);
 		}
 	};
+	Input.prototype.passwordActionClick = function(event) {
+		if (this.element.type === 'text') {
+			this.element.type = 'password';
+		} else {
+			this.element.type = 'text';
+		}
+		this.passwordAction.classList.toggle($.className('active'));
+		event.preventDefault();
+	};
 	Input.prototype.clearActionClick = function(event) {
 		var self = this;
 		self.element.value = '';
@@ -222,6 +242,9 @@
 				if (classList.contains($.className('input-speech'))) {
 					actions.push('speech');
 				}
+				if (classList.contains($.className('input-password'))) {
+					actions.push('password');
+				}
 				if (this.type === 'search' && row.classList.contains($.className('search'))) {
 					actions.push('search');
 				}

js/mui.ajax.js

@@ -130,7 +130,7 @@
 		if (settings.cache === false || ((!options || options.cache !== true) && ('script' === dataType))) {
 			settings.url = appendQuery(settings.url, '_=' + $.now());
 		}
-		var mime = settings.accepts[dataType];
+		var mime = settings.accepts[dataType.toLowerCase()];
 		var headers = {};
 		var setHeader = function(name, value) {
 			headers[name.toLowerCase()] = [name, value];

js/mui.class.scroll.js

@@ -18,6 +18,12 @@
 			fn: function(k) {
 				return Math.sqrt(1 - (--k * k));
 			}
+		},
+		outCirc: {
+			style: 'cubic-bezier(0.075, 0.82, 0.165, 1)'
+		},
+		outCubic: {
+			style: 'cubic-bezier(0.165, 0.84, 0.44, 1)'
 		}
 	}
 	var Scroll = $.Class.extend({
@@ -32,6 +38,7 @@
 				scrollX: false, //是否横向滚动
 				startX: 0, //初始化时滚动至x
 				startY: 0, //初始化时滚动至y
+
 				indicators: true, //是否显示滚动条
 				stopPropagation: false,
 				hardwareAccelerated: true,
@@ -41,11 +48,16 @@
 				},
 				momentum: true,
 
+				snapX: 0.5, //横向切换距离(以当前容器宽度为基准)
 				snap: false, //图片轮播，拖拽式选项卡
 
 				bounce: true, //是否启用回弹
-				bounceTime: 300, //回弹动画时间
-				bounceEasing: ease.circular.style, //回弹动画曲线
+				bounceTime: 500, //回弹动画时间
+				bounceEasing: ease.outCirc, //回弹动画曲线
+
+				scrollTime: 500,
+				scrollEasing: ease.outCubic, //轮播动画曲线
+
 
 				directionLockThreshold: 5,
 
@@ -122,7 +134,9 @@
 			var m = 0;
 			var n = -1;
 			var x = 0;
-			var cx = 0;
+			var leftX = 0;
+			var rightX = 0;
+			var snapX = 0;
 			for (var i = 0; i < length; i++) {
 				var snap = snaps[i];
 				var offsetLeft = snap.offsetLeft;
@@ -135,10 +149,13 @@
 					this.pages[m] = [];
 				}
 				x = this._getSnapX(offsetLeft);
-				cx = x - Math.round((offsetWidth) / 2);
+				snapX = Math.round((offsetWidth) * this.options.snapX);
+				leftX = x - snapX;
+				rightX = x - offsetWidth + snapX;
 				this.pages[m][n] = {
 					x: x,
-					cx: cx,
+					leftX: leftX,
+					rightX: rightX,
 					pageX: m,
 					element: snap
 				}
@@ -163,7 +180,7 @@
 					this.snaps[i].classList.remove(CLASS_ACTIVE);
 				}
 			}
-			this.scrollTo(this.currentPage.x, 0, this.options.bounceTime);
+			this.scrollTo(this.currentPage.x, 0, this.options.scrollTime);
 		},
 		_nearestSnap: function(x) {
 			if (!this.pages.length) {
@@ -174,15 +191,14 @@
 			}
 			var i = 0;
 			var length = this.pages.length;
-
 			if (x > 0) {
 				x = 0;
 			} else if (x < this.maxScrollX) {
 				x = this.maxScrollX;
 			}
-
 			for (; i < length; i++) {
-				if (x >= this.pages[i][0].cx) {
+				var nearestX = this.direction === 'left' ? this.pages[i][0].leftX : this.pages[i][0].rightX;
+				if (x >= nearestX) {
 					return this.pages[i][0];
 				}
 			}
@@ -398,7 +414,7 @@
 			if (!this.requestAnimationFrame) {
 				this._updateTranslate();
 			}
-
+			this.direction = detail.deltaX > 0 ? 'right' : 'left';
 			this.moved = true;
 			this.x = newX;
 			this.y = newY;
@@ -698,7 +714,7 @@
 			if (x == this.x && y == this.y) {
 				return false;
 			}
-			this.scrollTo(x, y, time, this.options.bounceEasing);
+			this.scrollTo(x, y, time, this.options.scrollEasing);
 
 			return true;
 		},
@@ -723,7 +739,7 @@
 
 		},
 		scrollToBottom: function(time, easing) {
-			time = time || this.options.bounceTime;
+			time = time || this.options.scrollTime;
 			this.scrollTo(0, this.maxScrollY, time, easing);
 		},
 		gotoPage: function(index) {

js/mui.class.scroll.slider.js

@@ -26,7 +26,7 @@
 				scrollY: false,
 				scrollX: true,
 				indicators: false,
-				bounceTime: 200,
+				scrollTime: 1000,
 				startX: false,
 				slideTime: 0, //滑动动画时间
 				snap: SELECTOR_SLIDER_ITEM
@@ -301,7 +301,7 @@
 		},
 		_gotoItem: function(slideNumber, time) {
 			this.currentPage = this._getPage(slideNumber, true); //此处传true。可保证程序切换时，动画与人手操作一致(第一张，最后一张的切换动画)
-			this.scrollTo(this.currentPage.x, 0, time, this.options.bounceEasing);
+			this.scrollTo(this.currentPage.x, 0, time, this.options.scrollEasing);
 			if (time === 0) {
 				$.trigger(this.wrapper, 'scrollend', this);
 			}
@@ -322,17 +322,17 @@
 				this.x = this.maxScrollX;
 			}
 			this.currentPage = this._nearestSnap(this.x);
-			this.scrollTo(this.currentPage.x, 0, time);
+			this.scrollTo(this.currentPage.x, 0, time, this.options.scrollEasing);
 			return true;
 		},
 		gotoItem: function(slideNumber, time) {
-			this._gotoItem(slideNumber, typeof time === 'undefined' ? this.options.bounceTime : time);
+			this._gotoItem(slideNumber, typeof time === 'undefined' ? this.options.scrollTime : time);
 		},
 		nextItem: function() {
-			this._gotoItem(this.slideNumber + 1, this.options.bounceTime);
+			this._gotoItem(this.slideNumber + 1, this.options.scrollTime);
 		},
 		prevItem: function() {
-			this._gotoItem(this.slideNumber - 1, this.options.bounceTime);
+			this._gotoItem(this.slideNumber - 1, this.options.scrollTime);
 		},
 		getSlideNumber: function() {
 			return this.slideNumber || 0;

js/mui.gestures.flick.js

@@ -19,6 +19,7 @@
 				break;
 			case $.EVENT_END:
 			case $.EVENT_CANCEL:
+				touch.flick = false;
 				if (session.flickStart && options.flickMaxTime > (now - flickStartTime) && touch.distance > options.flickMinDistince) {
 					touch.flick = true;
 					touch.flickTime = now - flickStartTime;

js/mui.gestures.js

@@ -401,7 +401,7 @@
 	//fixed hashchange(android)
 	window.addEventListener($.EVENT_CLICK, function(e) {
 		//TODO 应该判断当前target是不是在targets.popover内部，而不是非要相等
-		if (($.targets.popover && e.target === $.targets.popover) || ($.targets.tab) || $.targets.offcanvas || $.targets.modal) {
+		if (($.os.android || $.os.ios) && (($.targets.popover && e.target === $.targets.popover) || ($.targets.tab) || $.targets.offcanvas || $.targets.modal)) {
 			e.preventDefault();
 		}
 	}, true);

js/mui.gestures.swipe.js

@@ -9,6 +9,7 @@
 		var session = $.gestures.session;
 		if (event.type === $.EVENT_END || event.type === $.EVENT_CANCEL) {
 			var options = this.options;
+			touch.swipe = false;
 			//TODO 后续根据velocity计算
 			if (touch.direction && options.swipeMaxTime > touch.deltaTime && touch.distance > options.swipeMinDistince) {
 				touch.swipe = true;

js/mui.init.5+.js

@@ -36,7 +36,10 @@
 	 * @returns {Object}
 	 */
 	$.waitingOptions = function(options) {
-		return $.extend(true,{},{autoShow: true,title: ''}, options);
+		return $.extend(true, {}, {
+			autoShow: true,
+			title: ''
+		}, options);
 	};
 	/**
 	 * 窗口显示配置
@@ -44,7 +47,7 @@
 	 * @returns {Object}
 	 */
 	$.showOptions = function(options) {
-		return $.extend(true,{},defaultShow, options);
+		return $.extend(true, {}, defaultShow, options);
 	};
 	/**
 	 * 窗口默认配置
@@ -144,10 +147,6 @@
 	 * @param {object} options 可选:参数,等待,窗口,显示配置{params:{},waiting:{},styles:{},show:{}}
 	 */
 	$.openWindow = function(url, id, options) {
-
-		if (!window.plus) {
-			return;
-		}
 		if (typeof url === 'object') {
 			options = url;
 			url = options.url;
@@ -160,19 +159,29 @@
 				id = id || url;
 			}
 		}
+		if (!$.os.plus) {
+			window.top.location.href = url;
+			return;
+		}
+		if (!window.plus) {
+			return;
+		}
+
 		options = options || {};
 		var params = options.params || {};
-		var webview = null,webviewCache = null, nShow, nWaiting;
+		var webview = null,
+			webviewCache = null,
+			nShow, nWaiting;
 
-		if($.webviews[id]){
+		if ($.webviews[id]) {
 			webviewCache = $.webviews[id];
 			//webview真实存在，才能获取
-			if(plus.webview.getWebviewById(id)){
+			if (plus.webview.getWebviewById(id)) {
 				webview = webviewCache.webview;
 			}
 		}
 
-		if (webviewCache&&webview) { //已缓存
+		if (webviewCache && webview) { //已缓存
 			//每次show都需要传递动画参数；
 			//预加载的动画参数优先级：openWindow配置>preloadPages配置>mui默认配置；
 			nShow = webviewCache.show;
@@ -433,20 +442,21 @@
 					}
 				});
 			} else {
-				if (subpages.length > 0) {
-					var err = document.createElement('div');
-					err.className = 'mui-error';
-					//文字描述
-					var span = document.createElement('span');
-					span.innerHTML = '在该浏览器下，不支持创建子页面，具体参考';
-					err.appendChild(span);
-					var a = document.createElement('a');
-					a.innerHTML = '"mui框架适用场景"';
-					a.href = 'http://ask.dcloud.net.cn/article/113';
-					err.appendChild(a);
-					document.body.appendChild(err);
-					console.log('在该浏览器下，不支持创建子页面');
-				}
+				//已支持iframe嵌入
+				//				if (subpages.length > 0) {
+				//					var err = document.createElement('div');
+				//					err.className = 'mui-error';
+				//					//文字描述
+				//					var span = document.createElement('span');
+				//					span.innerHTML = '在该浏览器下，不支持创建子页面，具体参考';
+				//					err.appendChild(span);
+				//					var a = document.createElement('a');
+				//					a.innerHTML = '"mui框架适用场景"';
+				//					a.href = 'http://ask.dcloud.net.cn/article/113';
+				//					err.appendChild(a);
+				//					document.body.appendChild(err);
+				//					console.log('在该浏览器下，不支持创建子页面');
+				//				}
 
 			}
 
@@ -464,4 +474,13 @@
 
 		});
 	});
+	$.supportStatusbarOffset = function() {
+		return $.os.plus && $.os.ios && parseFloat($.os.version) >= 7;
+	};
+	$.ready(function() {
+		//标识当前环境支持statusbar
+		if ($.supportStatusbarOffset()) {
+			document.body.classList.add($.className('statusbar'));
+		}
+	});
 })(mui);
\ No newline at end of file

js/mui.init.js

@@ -62,6 +62,40 @@
 	$.addInit = function(init) {
 		return $.addAction('inits', init);
 	};
+	/**
+	 * 处理html5版本subpages 
+	 */
+	$.addInit({
+		name: 'iframe',
+		index: 100,
+		handle: function() {
+			var options = $.options;
+			var subpages = options.subpages || [];
+			if (!$.os.plus && subpages.length) {
+				//暂时只处理单个subpage。后续可以考虑支持多个subpage
+				createIframe(subpages[0]);
+			}
+		}
+	});
+	var createIframe = function(options) {
+		var wrapper = document.createElement('div');
+		wrapper.className = $.className('iframe-wrapper');
+		var styles = options.styles || {};
+		if (typeof styles.top !== 'string') {
+			styles.top = '0px';
+		}
+		if (typeof styles.bottom !== 'string') {
+			styles.bottom = '0px';
+		}
+		wrapper.style.top = styles.top;
+		wrapper.style.bottom = styles.bottom;
+		var iframe = document.createElement('iframe');
+		iframe.src = options.url;
+		iframe.id = options.id || options.url;
+		iframe.name = iframe.id;
+		wrapper.appendChild(iframe);
+		document.body.appendChild(wrapper);
+	};
 	$(function() {
 		var classList = document.body.classList;
 		var os = [];

js/mui.number.js

@@ -11,9 +11,9 @@
 	var tapEventName = touchSupport ? 'tap' : 'click';
 	var changeEventName = 'change';
 	var holderClassName = $.className('numbox');
-	var plusClassName = $.className('numbox-btn-plus');
-	var minusClassName = $.className('numbox-btn-minus');
-	var inputClassName = $.className('numbox-input');
+	var plusClassName = $.className('btn-numbox-plus') + "," + $.className("numbox-btn-plus");
+	var minusClassName = $.className('btn-numbox-minus') + "," + $.className("numbox-btn-minus");
+	var inputClassName = $.className('input-numbox') + "," + $.className("numbox-input");
 
 	var Numbox = $.Numbox = $.Class.extend({
 		/**
@@ -104,7 +104,9 @@
 		var instanceArray = [];
 		//遍历选择的元素
 		this.each(function(i, element) {
-			if (element.numbox) return;
+			if (element.numbox) {
+				return;
+			}
 			if (options) {
 				element.numbox = new Numbox(element, options);
 			} else {

js/mui.offcanvas.js

@@ -191,21 +191,23 @@
 								this._dispatchEvent(); //此处不触发webkitTransitionEnd,所以手动dispatch
 								return;
 							}
-							if (ratio > 0 && ratio < 0.5 && direction === 'right') {
-								this.openPercentage(0);
-							} else if (ratio > 0.5 && direction === 'left') {
+							if (direction === 'right' && ratio >= 0 && (ratio >= 0.5 || detail.swipe)) { //右滑打开
 								this.openPercentage(100);
-							} else if (ratio < 0 && ratio > -0.5 && direction === 'left') {
+							} else if (direction === 'right' && ratio < 0 && (ratio > -0.5 || detail.swipe)) { //右滑关闭
 								this.openPercentage(0);
-							} else if (direction === 'right' && ratio < 0 && ratio > -0.5) {
+							} else if (direction === 'right' && ratio > 0 && ratio < 0.5) { //右滑还原关闭
 								this.openPercentage(0);
-							} else if (ratio < 0.5 && direction === 'right') {
+							} else if (direction === 'right' && ratio < 0.5) { //右滑还原打开
 								this.openPercentage(-100);
-							} else if (direction === 'right' && ratio >= 0 && (ratio >= 0.5 || detail.flick)) {
-								this.openPercentage(100);
-							} else if (direction === 'left' && ratio <= 0 && (ratio <= -0.5 || detail.flick)) {
+							} else if (direction === 'left' && ratio <= 0 && (ratio <= -0.5 || detail.swipe)) { //左滑打开
 								this.openPercentage(-100);
-							} else {
+							} else if (direction === 'left' && ratio > 0 && (ratio <= 0.5 || detail.swipe)) { //左滑关闭
+								this.openPercentage(0);
+							} else if (direction === 'left' && ratio < 0 && ratio >= -0.5) { //左滑还原关闭
+								this.openPercentage(0);
+							} else if (direction === 'left' && ratio > 0.5) { //左滑还原打开
+								this.openPercentage(100);
+							} else { //默认关闭
 								this.openPercentage(0);
 							}
 							if (ratio === 1 || ratio === -1) { //此处不触发webkitTransitionEnd,所以手动dispatch
@@ -217,24 +219,22 @@
 							} else {
 								ratio = (this.offCanvasLeftWidth && (x / this.offCanvasLeftWidth)) || 0;
 							}
-							if (ratio >= 0.5 && direction === 'left') {
+							if (direction === 'right' && ratio <= 0 && (ratio >= -0.5 || detail.swipe)) { //右滑打开
+								this.openPercentage(100);
+							} else if (direction === 'right' && ratio > 0 && (ratio >= 0.5 || detail.swipe)) { //右滑关闭
 								this.openPercentage(0);
-							} else if (ratio > 0 && ratio <= 0.5 && direction === 'left') {
-								this.openPercentage(-100);
-							} else if (ratio >= 0.5 && direction === 'right') {
+							} else if (direction === 'right' && ratio <= -0.5) { //右滑还原关闭
 								this.openPercentage(0);
-							} else if (ratio >= -0.5 && ratio < 0 && direction === 'left') {
-								this.openPercentage(100);
-							} else if (ratio > 0 && ratio <= 0.5 && direction === 'right') {
+							} else if (direction === 'right' && ratio > 0 && ratio <= 0.5) { //右滑还原打开
 								this.openPercentage(-100);
-							} else if (ratio <= -0.5 && direction === 'right') {
+							} else if (direction === 'left' && ratio >= 0 && (ratio <= 0.5 || detail.swipe)) { //左滑打开
+								this.openPercentage(-100);
+							} else if (direction === 'left' && ratio < 0 && (ratio <= -0.5 || detail.swipe)) { //左滑关闭
 								this.openPercentage(0);
-							} else if (ratio >= -0.5 && direction === 'right') {
-								this.openPercentage(100);
-							} else if (ratio <= -0.5 && direction === 'left') {
+							} else if (direction === 'left' && ratio >= 0.5) { //左滑还原关闭
 								this.openPercentage(0);
-							} else if (ratio >= -0.5 && direction === 'left') {
-								this.openPercentage(-100);
+							} else if (direction === 'left' && ratio >= -0.5 && ratio < 0) { //左滑还原打开
+								this.openPercentage(100);
 							} else {
 								this.openPercentage(0);
 							}
@@ -304,7 +304,6 @@
 				}
 				this.classList[percentage !== 0 ? 'add' : 'remove'](CLASS_ACTIVE);
 			}
-
 		},
 		updateTranslate: function(x) {
 			if (x !== this.lastTranslateX) {

js/mui.pullrefresh.js

@@ -28,9 +28,10 @@
 				scrollY: true,
 				scrollX: false,
 				indicators: true,
-				deceleration:0.003,
+				deceleration: 0.003,
 				down: {
 					height: 50,
+					contentinit: '下拉可以刷新',
 					contentdown: '下拉可以刷新',
 					contentover: '释放立即刷新',
 					contentrefresh: '正在刷新...'
@@ -38,6 +39,7 @@
 				up: {
 					height: 50,
 					auto: false,
+					contentinit: '上拉显示更多',
 					contentdown: '上拉显示更多',
 					contentrefresh: '正在加载...',
 					contentnomore: '没有更多数据了',
@@ -91,7 +93,7 @@
 		_createPocket: function(clazz, options, iconClass) {
 			var pocket = document.createElement('div');
 			pocket.className = clazz;
-			pocket.innerHTML = pocketHtml.replace('{contentrefresh}', options.contentrefresh).replace('{icon}', iconClass);
+			pocket.innerHTML = pocketHtml.replace('{contentrefresh}', options.contentinit).replace('{icon}', iconClass);
 			return pocket;
 		},
 		_resetPullDownLoading: function() {

js/mui.target.js

@@ -53,6 +53,26 @@
 				break;
 			}
 		}
-
 	});
-})(mui, window, document);
+	window.addEventListener('click', function(event) { //解决touch与click的target不一致的问题(比如链接边缘点击时，touch的target为html，而click的target为A)
+		var target = event.target;
+		var isFound = false;
+		for (; target && target !== document; target = target.parentNode) {
+			if (target.tagName === 'A') {
+				$.each($.targetHandles, function(index, targetHandle) {
+					var name = targetHandle.name;
+					if (targetHandle.hasOwnProperty('handle')) {
+						if (targetHandle.handle(event, target)) {
+							isFound = true;
+							event.preventDefault();
+							return false;
+						}
+					}
+				});
+				if (isFound) {
+					break;
+				}
+			}
+		}
+	});
+})(mui, window, document);
\ No newline at end of file

js/popovers.js

@@ -106,7 +106,10 @@
 
 	});
 
-	var togglePopover = function(popover, anchor) {
+	var togglePopover = function(popover, anchor, state) {
+		if ((state === 'show' && popover.classList.contains(CLASS_ACTIVE)) || (state === 'hide' && !popover.classList.contains(CLASS_ACTIVE))) {
+			return;
+		}
 		removeBackdropTimer && removeBackdropTimer.cancel(); //取消remove的timer
 		//remove一遍，以免来回快速切换，导致webkitTransitionEnd不触发，无法remove
 		popover.removeEventListener('webkitTransitionEnd', onPopoverShown);
@@ -276,7 +279,7 @@
 		this.each(function() {
 			$.targets._popover = this;
 			if (args[0] === 'show' || args[0] === 'hide' || args[0] === 'toggle') {
-				togglePopover(this, args[1]);
+				togglePopover(this, args[1], args[0]);
 			}
 		});
 	};

js/pullrefresh.5+.js

@@ -134,15 +134,22 @@
 			}
 		},
 		pulldownLoading: function() { //该方法是子页面调用的
+			$.plusReady(function() {
+				plus.webview.currentWebview().setBounce({
+					offset: {
+						top: this.options.down.height + "px"
+					}
+				});
+			}.bind(this));
 			var callback = $.options.pullRefresh.down.callback;
 			callback && callback.call(this);
 		},
-		_pulldownLoading: function() { //该方法是子页面调用的
-			var self = this;
-			$.plusReady(function() {
-				plus.webview.getWebviewById(self.options.webviewId).evalJS("mui&&mui.options.pullRefresh.down&&mui.options.pullRefresh.down.callback()");
-			});
-		},
+		//		_pulldownLoading: function() { //该方法是子页面调用的
+		//			var self = this;
+		//			$.plusReady(function() {
+		//				plus.webview.getWebviewById(self.options.webviewId).evalJS("mui&&mui.options.pullRefresh.down&&mui.options.pullRefresh.down.callback()");
+		//			});
+		//		},
 		endPulldownToRefresh: function() { //该方法是子页面调用的
 			var webview = plus.webview.currentWebview();
 			webview.parent().evalJS("mui&&mui(document.querySelector('.mui-content')).pullRefresh('" + JSON.stringify({
@@ -255,7 +262,7 @@
 			pullRefreshApi = $.data[id];
 		}
 		if (options.down && options.down.auto) { //如果设置了auto，则自动下拉一次
-			pullRefreshApi._pulldownLoading(); //parent webview
+			pullRefreshApi.pulldownLoading(); //parent webview
 		} else if (options.up && options.up.auto) { //如果设置了auto，则自动上拉一次
 			pullRefreshApi.pullupLoading();
 		}

js/switches.js

@@ -72,6 +72,7 @@
 		}
 	};
 	Toggle.prototype.start = function(e) {
+		this.handle.style.webkitTransitionDuration = this.element.style.webkitTransitionDuration = '.2s';
 		this.classList.add(CLASS_DRAGGING);
 		if (this.toggleWidth === 0 || this.handleWidth === 0) { //当switch处于隐藏状态时，width为0，需要重新初始化
 			this.init();
@@ -109,8 +110,13 @@
 			this.toggle();
 		}
 	};
-	Toggle.prototype.toggle = function() {
+	Toggle.prototype.toggle = function(animate) {
 		var classList = this.classList;
+		if (animate === false) {
+			this.handle.style.webkitTransitionDuration = this.element.style.webkitTransitionDuration = '0s';
+		} else {
+			this.handle.style.webkitTransitionDuration = this.element.style.webkitTransitionDuration = '.2s';
+		}
 		if (classList.contains(CLASS_ACTIVE)) {
 			classList.remove(CLASS_ACTIVE);
 			this.handle.style.webkitTransform = 'translate(0,0)';

js/tableviews.js

@@ -96,7 +96,7 @@
 	};
 	var setTranslate = function(element, x) {
 		if (element) {
-			element.style.webkitTransform = 'translate3d(' + x + 'px,0,0)';
+			element.style.webkitTransform = 'translate(' + x + 'px,0)';
 		}
 	};
 

package.json

 {
   "name": "mui",
-  "description": "Build mobile apps with simple HTML, CSS, and JS components.",
-  "version": "2.6.0",
+  "description": "最接近原生体验的高性能前端框架.",
+  "version": "2.7.0",
   "keywords": [
     "css",
     "fonts",

sass/forms.scss

@@ -190,7 +190,7 @@ select {
     .#{$namespace}inline{
         padding: 8px 0;
     }
-    .#{$namespace}input-clear ~ .#{$namespace}icon-clear,.#{$namespace}input-speech ~ .#{$namespace}icon-speech{
+    .#{$namespace}input-clear ~ .#{$namespace}icon-clear,.#{$namespace}input-speech ~ .#{$namespace}icon-speech,.#{$namespace}input-password ~ .#{$namespace}icon-eye{
         position:absolute;
         right: 0px;
         top: 10px;
@@ -200,6 +200,9 @@ select {
         text-align: center;
         color:#999;
         z-index: z("default");
+        &.#{$namespace}active{
+            color:$primary-color;
+        }
     }
     .#{$namespace}input-speech ~ .#{$namespace}icon-speech{
         top:8px;

sass/hack.scss

@@ -7,6 +7,12 @@ textarea{
     }
 }	
 }
+.#{$namespace}android.#{$namespace}android-4-2,.#{$namespace}android.#{$namespace}android-4-3 {
+input,
+textarea{
+    -webkit-user-select: text;
+}   
+}
 //解决ios list 过多(height>20000px) crash的bug
 .#{$namespace}ios .#{$namespace}table-view-cell {
     -webkit-transform-style: preserve-3d;

sass/icon.scss

@@ -18,7 +18,9 @@
     line-height: 1;
     text-decoration: none;
     -webkit-font-smoothing: antialiased;
-
+    &.#{$namespace}active{
+        color:$primary-color;
+    }
     &.#{$namespace}right{
         &:before{
             float:right;
@@ -149,6 +151,7 @@
 .#{$namespace}icon-loop:before { content: "\e565"; }
 // .#{$namespace}icon-loopstrong:before { content: "\e566"; }
 .#{$namespace}icon-paperclip:before { content: "\e567"; }
+.#{$namespace}icon-eye:before { content: "\e568"; }
 
 // 箭头
 .#{$namespace}icon-arrowup:before { content: "\e580"; }

sass/iframe.scss

+.#{$namespace}iframe-wrapper{
+    position: absolute;
+    left: 0;
+    right: 0;
+    iframe{
+      border: 0;
+      width: 100%;
+      height: 100%;  
+    }
+}
+

sass/mui.scss

@@ -43,4 +43,6 @@
 @import "fullscreen.scss";
 @import "hack.scss";
 // os
-@import "os.scss";
+@import "os.scss";
\ No newline at end of file
+//iframe
+@import "iframe.scss";
\ No newline at end of file

sass/number.scss

@@ -11,7 +11,8 @@
 	width: 120px;
 	vertical-align: middle;
 
-	[class*=mui-numbox-btn] {
+	//基于.mui-btn扩展，故命名修改为mui-btn-numbox
+	[class*=numbox-btn],[class*=btn-numbox] {
 		width: 40px;
 		height: 100%;
 		position: absolute;
@@ -34,18 +35,18 @@
 		}
 	}
 
-	.#{$namespace}numbox-btn-plus {
+	.#{$namespace}numbox-btn-plus,.#{$namespace}btn-numbox-plus {
 		right: 0px;
 		border-top-right-radius:3px;
 		border-bottom-right-radius:3px;
 	}
-	.#{$namespace}numbox-btn-minus {
+	.#{$namespace}numbox-btn-minus,.#{$namespace}btn-numbox-minus {
 		left: 0px;
 		border-top-left-radius:3px;
 		border-bottom-left-radius:3px;
 	}
 
-	.#{$namespace}numbox-input {
+	.#{$namespace}numbox-input,.#{$namespace}input-numbox {
 		width: 100% !important;
 		height: 100%;
 		text-align: center;

sass/off-canvas.scss

@@ -21,8 +21,8 @@
         height:100%;
         z-index: z("default");
         &.#{$namespace}transitioning{
-            -webkit-transition: -webkit-transform 200ms ease;
-            transition: transform 200ms ease;    
+            -webkit-transition: -webkit-transform 350ms ;
+            transition: transform 350ms cubic-bezier(0.165, 0.84, 0.44, 1);    
         }
         .#{$namespace}off-canvas-left {
             @include transform(translate3d(-100%, 0, 0));
@@ -35,8 +35,8 @@
          overflow:hidden;
          height:100%;
          .#{$namespace}off-canvas-backdrop{
-             -webkit-backface-visibility: hidden;
-            transition: background 200ms ease;
+//           -webkit-backface-visibility: hidden;
+            transition: background 350ms cubic-bezier(0.165, 0.84, 0.44, 1);
             box-shadow: -4px 0 4px rgba(0, 0, 0, 0.5), 4px 0 4px rgba(0, 0, 0, 0.5);
             display: block;
             position: absolute;
@@ -63,7 +63,7 @@
 
 
 .#{$namespace}off-canvas-left, .#{$namespace}off-canvas-right {
-    -webkit-backface-visibility: hidden;
+//  -webkit-backface-visibility: hidden;
     width: 70%;
     min-height:100%;
     top: 0;
@@ -75,8 +75,8 @@
     z-index: -1;
     visibility: hidden;
     &.#{$namespace}transitioning{
-        -webkit-transition: -webkit-transform 200ms ease;
-        transition: transform 200ms ease;    
+        -webkit-transition: -webkit-transform 350ms cubic-bezier(0.165, 0.84, 0.44, 1);
+        transition: transform 350ms cubic-bezier(0.165, 0.84, 0.44, 1);    
     }
 }
 .#{$namespace}off-canvas-left {
@@ -94,8 +94,8 @@
         @include transform(scale(0.8));
         opacity: 0.1;
         &.#{$namespace}transitioning{
-            -webkit-transition: -webkit-transform 200ms ease, opacity 200ms ease;
-            transition: transform 200ms ease, opacity 200ms ease;
+            -webkit-transition: -webkit-transform 350ms cubic-bezier(0.165, 0.84, 0.44, 1), opacity 350ms cubic-bezier(0.165, 0.84, 0.44, 1);
+            transition: transform 350ms cubic-bezier(0.165, 0.84, 0.44, 1), opacity 350ms cubic-bezier(0.165, 0.84, 0.44, 1);
         }
     }
     >.#{$namespace}off-canvas-left{

sass/os.scss

@@ -16,3 +16,24 @@
 .#{$namespace}plus .#{$namespace}plus-hidden,.#{$namespace}wechat .#{$namespace}wechat-hidden{
     display: none!important;
 }
+
+
+//ios 状态栏
+.#{$namespace}plus.#{$namespace}statusbar.#{$namespace}statusbar-offset{
+    .#{$namespace}bar-nav {
+        padding-top: 20px;
+        height:64px;
+        &~.#{$namespace}content {
+            padding-top: 64px;
+            .#{$namespace}pull-top-pocket {
+                top: 64px;
+            }
+        }
+    }
+    .#{$namespace}bar-header-secondary {
+        top: 64px;
+        &~.#{$namespace}content {
+            padding-top: 94px;
+        }
+    }
+}

sass/pullrefreshs.scss

@@ -70,7 +70,7 @@
 //vertical-align: middle;
 //}
 .#{$namespace}pull-loading{
-    -webkit-backface-visibility: hidden;
+//  -webkit-backface-visibility: hidden;
     -webkit-transition-duration: 400ms;
     transition-duration: 400ms;
     -webkit-transition:-webkit-transform 0.4s;

sass/scroll.scss

 
 .#{$namespace}scroll-wrapper {
-    -webkit-backface-visibility: hidden;
+//  -webkit-backface-visibility: hidden;
     position: absolute;
     z-index: z("default");
     top: 0px;
@@ -10,7 +10,7 @@
     overflow: hidden;
 }
 .#{$namespace}scroll {
-    -webkit-backface-visibility: hidden;
+//  -webkit-backface-visibility: hidden;
     position: absolute;
     z-index: z("default");
     width: 100%;

sass/sliders.scss

@@ -127,7 +127,7 @@
     }
 }
 .#{$namespace}slider-progress-bar{
-    -webkit-backface-visibility: hidden;
+//  -webkit-backface-visibility: hidden;
     @include transform(translateZ(0));
     height:2px;
     z-index:z("default");

sass/table-views.scss

@@ -178,12 +178,12 @@
     >.#{$namespace}slider-handle,>.#{$namespace}slider-left .#{$namespace}btn,>.#{$namespace}slider-right .#{$namespace}btn{
         -webkit-transition: -webkit-transform 0ms ease;
         transition: transform 0ms ease;
-        -webkit-backface-visibility: hidden;
-        backface-visibility: hidden;
+//      -webkit-backface-visibility: hidden;
+//      backface-visibility: hidden;
         }
      >.#{$namespace}slider-left,>.#{$namespace}slider-right{
-        -webkit-backface-visibility: hidden;
-        backface-visibility: hidden;
+//      -webkit-backface-visibility: hidden;
+//      backface-visibility: hidden;
         position: absolute;
         top: 0;
         height: 100%;