html5中文学习网

您的位置: 首页?>?网站及特效实例?>?html5实验 ? 正文

移动webapp开发小贴士

[ ] 已经帮助:人解决问题

1 创建主屏幕图标 (Creating a home screen icon ,for ios)

//57*57

2 启动画面图像 (Creating a splash screen, for ios)

3 全屏 (Making it full-screen, for ios)– 更像本地App

4 改变状态栏 (Changing the phone status bar, for ios)

content属性default, black and black-translucentWWmHTML5中文学习网 - HTML5先行者学习网

*developer.apple.com/library/IOs/documentation/AppleApplications/Reference/SafariWebContent/ConfiguringWebApplications/ConfiguringWebApplications.html#//apple_ref/doc/uid/TP40002051-CH3-SW1WWmHTML5中文学习网 - HTML5先行者学习网

5 阻止缩放 (Preventing scaling)

6 阻止弹性滚动(Preventing elastic scrolling)

  ...

7 检测屏幕是否旋转(Detect whether device supports orientationchange event, otherwise fall back to the resize event)

//Detect whether device supports orientationchange event, otherwise fall back to//the resize event.var supportsOrientationChange = "onorientationchange" in window,    orientationEvent = supportsOrientationChange ? "orientationchange" : "resize";window.addEventListener(orientationEvent, function() {    alert('HOLY ROTATING SCREENS BATMAN:' + window.orientation + " " + screen.width);}, false);

8 禁止webapp跳转到safari(for ios)

// Mobile Safari in standalone modeif (("standalone" in window.navigator) && window.navigator.standalone) {        // If you want to prevent remote links in standalone web apps opening Mobile Safari, change 'remotes' to true    var noddy,        remotes = false;    document.addEventListener('click', function(event) {        noddy = event.target;        //Bubble up until we hit link or top HTML element. Warning: BODY element is not compulsory so better to stop on HTML        while (noddy.nodeName !== "A" && noddy.nodeName !== "HTML") {            noddy = noddy.parentNode;        }        if ('href' in noddy && noddy.href.indexOf('http') !== -1 && (noddy.href.indexOf(document.location.host) !== -1 || remotes)) {            event.preventDefault();            document.location.href = noddy.href;        }    }, false);}

9 禁用手机号码链接(for ios)

10 阻止旋转屏幕时自动调整字体大小

-webkit-text-size-adjust:none;

11 IOS中禁止用户选中文字

-webkit-user-select:none;

12 iOS中如何禁止用户保存图片 复制图片

-webkit-touch-calloutt:none;

13 语音输入

14 文件上传, 从相机捕获媒体

15 电话短信

 发送短信附带内容 的链接
                                
                            
(责任编辑:)
推荐书籍
推荐资讯
关于HTML5先行者 - 联系我们 - 广告服务 - 友情链接 - 网站地图 - 版权声明 - 人才招聘 - 帮助