设备兼容处理

MUI HTML5

MUI

设备兼容处理

/******************Android系统相关处理代码*******************/
一、在android4.4.2中的swipe事件,需要preventDefault一下,否则触发不正常
window.addEventListener('dragstart',function(e){
 mui.gestures.touch.lockDirection = true; //锁定方向
 mui.gestures.touch.startDirection = e.detail.direction;
});
window.addEventListener('dragleft', function(e) {
 if(!mui.isScrolling){
  e.detail.gesture.preventDefault(); 
 }
});

二、只有ios支持的功能需要在Android平台隐藏;
if (mui.os.android) {
 var list = document.querySelectorAll('.ios-only');
 if (list) {
  for (var i = 0; i < list.length; i++) {
   list[i].style.display = 'none';
  }
 }
}

三、iOS平台支持侧滑关闭,父窗体侧滑隐藏后,同时需要隐藏子窗体;
5+父窗体隐藏,子窗体还可以看到?不符合逻辑吧?
if (mui.os.ios) {
 headerWebview.addEventListener('hide', function() {
  subWebview.hide("none");
 });
}

四、Android暂不支持整体移动动画
if(!mui.os.android){
 document.getElementById("move-togger").classList.remove('mui-hidden');
 var spans = document.querySelectorAll('.android-only');
 for (var i=0,len=spans.length;i<len;i++) {
  spans[i].style.display = "none";
 }
}

五、 实现ios平台的侧滑关闭页面;
if (mui.os.plus && mui.os.ios) {
 offCanvasWrapper[0].addEventListener('shown', function(e) { //菜单显示完成事件
  plus.webview.currentWebview().setStyle({
   'popGesture': 'none'
  });
 });
 offCanvasWrapper[0].addEventListener('hidden', function(e) { //菜单关闭完成事件
  plus.webview.currentWebview().setStyle({
   'popGesture': 'close'
  });
 });
}
 //实现ios平台原生侧滑关闭页面;
 //5+ iOS暂时无法屏蔽popGesture时传递touch事件,故该demo直接屏蔽popGesture功能
if (mui.os.plus && mui.os.ios) {
 mui.plusReady(function() {
  plus.webview.currentWebview().setStyle({
   'popGesture': 'none'
  });
 });
}

六、重写mui.menu方法,Android版本menu按键按下可自动打开、关闭侧滑菜单;
mui.menu = function() {
 if (showMenu) {
  closeMenu();
 } else {
  openMenu();
 }
}

mui.back();