移动端页面常见问题_II

控制显示区域各种属性：

<meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport">

      width                      - viewport的宽度

• height                     – viewport的高度
• initial-scale          - 初始的缩放比例
• minimum-scale  - 允许用户缩放到的最小比例
• maximum-scale – 允许用户缩放到的最大比例
• user-scalable       – 用户是否可以手动缩放

IOS中Safari允许全屏浏览：

<meta content="yes" name="apple-mobile-web-app-capable">

IOS中Safari顶端状态条样式：

<meta content="black" name="apple-mobile-web-app-status-bar-style">

忽略将数字变为电话号码：

<meta content="telephone=no" name="format-detection">

一般情况下，IOS和Android系统都会默认某长度内的数字为电话号码，即使不加也是会默认显示为电话的，so，取消这个很有必要！

IOS中Safari设置保存到桌面图标：

这是IOS中Safari特有的meta，是在你保存某个页面到桌面的时候使用这张图作为桌面图标，so，尺寸和iphone上的一致，是57*57px

<link rel="apple-touch-icon" href="custom_icon.png">

4. 屏幕旋转事件：onorientationchange
添加屏幕旋转事件侦听，可随时发现屏幕旋转状态（左旋、右旋还是没旋）。例子：

5. 隐藏地址栏 & 处理事件的时候，防止滚动条出现：

/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*

/*! Normalized address bar hiding for iOS & Android (c) @scottjehl MIT License */
(function( win ){
var doc = win.document;

// If there‘s a hash, or addEventListener is undefined, stop here
if(!win.navigator.standalone && !location.hash && win.addEventListener ){

//scroll to 1
win.scrollTo( 0, 1 );
var scrollTop = 1,
getScrollTop = function(){
return win.pageYOffset || doc.compatMode === "CSS1Compat" && doc.documentElement.scrollTop || doc.body.scrollTop || 0;
},

//reset to 0 on bodyready, if needed
bodycheck = setInterval(function(){
if( doc.body ){
clearInterval( bodycheck );
scrollTop = getScrollTop();
win.scrollTo( 0, scrollTop === 1 ? 0 : 1 );
}
}, 15 );

win.addEventListener( "load", function(){
setTimeout(function(){
//at load, if user hasn‘t scrolled more than 20 or so...
if( getScrollTop() < 20 ){
//reset to hide addr bar at onload
win.scrollTo( 0, scrollTop === 1 ? 0 : 1 );
}
}, 0);
}, false );
}
})( this );

/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*/*

6. 双手指滑动事件：

7. 判断是否为iPhone：

8. localStorage:
 例子 ：（注意数据名称  n  要用引号引起来）

9. 使用特殊链接：
 如果你关闭自动识别后 ，又希望某些电话号码能够链接到 iPhone 的拨号功能 ，那么可以通过这样来声明电话链接 ,

10. 自动大写与自动修正
要关闭这两项功能，可以通过autocapitalize 与autocorrect 这两个选项：

document.addEventListener(‘WeixinJSBridgeReady‘, function onBridgeReady() {
WeixinJSBridge.call(‘hideOptionMenu‘);
});

document.addEventListener(‘WeixinJSBridgeReady‘, function onBridgeReady() {
WeixinJSBridge.call(‘hideToolbar‘);
});

WeixinJSBridge.invoke(‘getNetworkType‘,{},
		function(e){
	    	WeixinJSBridge.log(e.err_msg);
	    });