window.orientation ，取值：正负90表示横屏模式、0和180表现为竖屏模式；
window.onorientationchange = function(){ switch(window.orientation){ case -90: case 90: alert("横屏:" + window.orientation); case 0: case 180: alert("竖屏:" + window.orientation); break; } }
样式
//竖屏时使用的样式 @media all and (orientation:portrait) { .css{} } //横屏时使用的样式 @media all and (orientation:landscape) { .css{} } 19、audio元素和video元素在ios和andriod中无法自动播放应对方案：触屏即播
$(\'html\').one(\'touchstart\',function(){ audio.play() })可参考《 无法自动播放的audio元素 》
20、摇一摇功能HTML5 deviceMotion ：封装了运动传感器数据的事件，可以获取手机运动状态下的运动加速度等数据。
HTML5晃动DeviceMotionEvent事件
21、手机拍照和上传图片使用 <input type=“file”> 的 accept 属性
<!-- 选择照片 --> <input type=file accept="image/*"> <!-- 选择视频 --> <input type=file accept="video/*">使用总结：
ios 有拍照、录像、选取本地图片功能
部分android只有选取本地图片功能
winphone不支持
input控件默认外观丑陋
22、微信浏览器用户调整字体大小后页面变矬了，怎么阻止用户调整原理 ：
android侧是复写了 layoutinflater 对 textview 做了统一处理
ios侧是修改了 body.style.webkitTextSizeAdjust 值
解决方案 ：
android使用以下代码，该接口只在微信浏览器下有效
/** * 页面加入这段代码可使Android机器页面不再受到用户字体缩放强制改变大小 * 但是会有一个1秒左右的延迟，期间可以考虑通过loading展示 * 仅供参考 */ (function(){ if (typeof(WeixinJSBridge) == "undefined") { document.addEventListener("WeixinJSBridgeReady", function (e) { setTimeout(function(){ WeixinJSBridge.invoke(\'setFontSizeCallback\',{"fontSize":0}, function(res) { alert(JSON.stringify(res)); }); },0); }); } else { setTimeout(function(){ WeixinJSBridge.invoke(\'setFontSizeCallback\',{"fontSize":0}, function(res) { alert(JSON.stringify(res)); }); },0); } })();
ios使用 -webkit-text-size-adjust 禁止调整字体大小
body{-webkit-text-size-adjust: 100%!important;}
***的解决方案：