Fork me on GitHub

跨终端WEB

Mobile Web

head内的meta,写下备用

<!--user-scalable=no是需要的,发现在某些设备上仅有initial和maximum仍然无法阻止缩放 -->
<meta content="initial-scale=1,maximum-scale=1,user-scalable=no,width=device-width" name="viewport"/>

<!-- touch-icon在IOS中用于桌面图标 -->
<link href="https://github.com/fluidicon.png" rel="apple-touch-icon-precomposed">

<!-- 从桌面icon 启动 iOS Safari 是否进入全屏状态(App模式)yes|no -->
<meta content="yes" name="apple-mobile-web-app-capable"/>

<-- iOS Safari 全屏状态下的状态栏样式 default  |  black  |  black-translucent -->
<meta content="black-translucent" name="apple-mobile-web-app-status-bar-style" />

<!-- iOS 设备上禁止将数字识别为可点击的tel link -->
<meta content="telephone=no" name="format-detection">

《在移动浏览器中使用Viewport元标签控制布局》

《Viewport双城记》-1

《Viewport双城记》-2

Hammer.js是目前使用较广泛的一个事件库,没用过,回头用一下试试哈

weinre 远程调试

远程测试 例如:移动云测试中心,云测