phonegap+html5开发app的一些总结
1.Css3圆角白边:使用css3圆角效果时,在android某些机器上会产生白边,所以应该在圆角的div外套一个div(背景色和外部相同),然后有圆角效果的div 内部使用自己的背景色
border-radius:5px;
box-shadow:inset 0 2px 5px #e1e1e1;
<div style=””>
<div style=”border-radius:5px;box-shadow:inset 0 2px 5px #e1e1e1;”>
</div>
</div>
2.屏幕分辨率问题:比如pc上的640*480和设备的分辨率640*480不一样,涉及到分辨率密度(dpi)。pc上按照640px开发的页面直接放在设备(设备的分辨率可能高达1024*960)上可能就超出了。
在android下可以采用target-densitydpi = [dpi_value | device-dpi | high-dpi | medium-dpi | low-dpi]来自动根据设备尺寸来缩放。
IOS不支持这个设置,通过initial-scale = float_value手动缩放
<!-- html document -->
<meta name="viewport"
content="
height = [pixel_value | device-height] ,
width = [pixel_value | device-width ] ,
initial-scale = float_value ,
minimum-scale = float_value ,
maximum-scale = float_value ,
user-scalable = [yes | no] ,
target-densitydpi = [dpi_value | device-dpi | high-dpi | medium-dpi | low-dpi]"
/>
3.设备键盘弹出挤压页面导致页面固定元素(比如导航栏和底部工具栏)位置错乱。
position:fixed;
方法一:IOS有专门的设置控制键盘是否影响布局,改为不影响。(键盘将会覆盖到页面上方而不会挤压页面内容)
Phonegap工程中 config.xml:
<preference name="KeyboardShrinksView" value="false" />
phonegap+html5开发app的一些总结的更多相关文章
- HTML5 开发APP(打开相册以及图片上传)
我们开发app,常常会遇到让用户上传文件的功能.比如让用户上传头像.我公司的业务要求是让用户上传支付宝收款二维码,来实现用户提现的功能.想要调用相册要靠HTML Plus来实现.先上效果图 基本功能是 ...
- HTML5 开发APP(头部和底部选项卡)
我们开发app有一定固定的样式,比如头部和底部选项卡部分就是公共部分就比如我在做的app进来的主页面就像图片显示的那样 我们该怎么实现呢,实现我们应该建一个主页面index.html,然后建五个子页面 ...
- HTML5 开发APP( 环境配置)
上一篇我写了关于新建项目,这一篇说一下配置环境我们新建一个移动app后,会发现一个mainifest.json文件,开发app所要配置的环境就在这个文件里 点击打开文件后会有配置界面,在配置界面的下方 ...
- HTML5 开发APP(MUI的一些特性)
先附mui文档地址:http://dev.dcloud.net.cn/mui/ui/ .mui的UI组件比较简单而且在文档中很好找就不过多说了. 1 在app开发中,使用HTML5+的api,必须m ...
- HTML5 开发APP 第一章
当今天下,移动端基本上是安卓和苹果的天下,基本上没微软什么事,作为微软忠实的支持者,也要顺势而变. 但安卓和IOS 开发是两个完全不同的世界,有没有一种技术,开发完以后可以运行在任意终端呢,答案是有 ...
- HTML5 开发APP( 支付宝支付)
我们搞app有一个重要的功能那就是支付功能.无论是微信支付,支付宝,还是银联支付总要有一样支付手段来支持我们网上付款.实现完整的功能.我们公司app的支付方式经过大家开会讨论选择了支付宝支付(其实是当 ...
- HTML5 开发APP
近期在做app,现在项目进行了一段时间,我打算把自己的经验写出来,给自己总结一下也给会用小伙伴看一下.本人前端一枚.我们所以能选的技术就是CSS,HTML,JS了,经过准备我决定用HBuilder 准 ...
- 在App中混合HTML5开发App如何实现的。在App中使用HTML5的优缺点是什么?
参考答案: 在iOS中,通常是通常UIWebView来实现,当然在iOS8以后可以使用WKWebView来实现.有以下几种实现方法: 通过实现UIWebView的代理方法来拦截,判断scheme是否是 ...
- Html5+ 开发APP 后台运行代码
function backRunning(){ if(plus.os.name == 'Android'){ var main = plus.android.runtimeMainActivity() ...
随机推荐
- [COJ0988]WZJ的数据结构(负十二)
[COJ0988]WZJ的数据结构(负十二) 试题描述 输入 见题目,注意本题不能用文件输入输出 输出 见题目,注意本题不能用文件输入输出 输入示例 输出示例 数据规模及约定 1≤N≤1500,M≤N ...
- HTML5 自制本地网页视频播放器
HTML5初试:本地视频用网页打开啦半个广告都可以没有,看来暴风什么的快要淘汰了. 视频格式还是有要求的,看来要备一个转码器. 格式 IE Firefox Opera Chrome Safari Og ...
- poj1753枚举
Flip Game Time Limit: 1000MS Memory Limit: 65536K Total Submissions: 33670 Accepted: 14713 Descr ...
- shell笔记-local、export用法 、declare、set
local一般用于局部变量声明,多在在函数内部使用. 1. Shell脚本中定义的变量是global的,其作用域从被定义的地方开始,到shell结束或被显示删除的地方为止. 2. ...
- 深入学习微框架:Spring Boot - NO
http://blog.csdn.net/hengyunabc/article/details/50120001 Our primary goals are: Provide a radically ...
- 38.输出1到最大的N位数[Print 1 to max number of N bits]
[题目] 输入数字n,按顺序输出从1最大的n位10进制数.比如输入3,则输出1.2.3一直到最大的3位数即999. [分析] 这是一道很有意思的题目.看起来很简单,其实里面却有不少的玄机. [常规思路 ...
- 化工厂装箱员(洛谷 P2530)
题目描述 118号工厂是世界唯一秘密提炼锎的化工厂,由于提炼锎的难度非常高,技术不是十分完善,所以工厂生产的锎成品可能会有3种不同的纯度,A:100%,B:1%,C:0.01%,为了出售方便,必须 ...
- Perl中的正则表达式
转自:http://c20031776.blog.163.com/blog/static/684716252013624383887/ Perl 程序中,正则表达式有三种存在形式 分别是 (1 模式匹 ...
- Ubuntu16.04 安装openjdk-7-jdk
Ubuntu16.04 安装openjdk-7-jdk sudo apt-get install openjdk-7-jre 或者sudo apt-get install openjdk-7-jdk ...
- Java Hour 58 Java Virtual Machine
每每谈到Java Virtual Machine, 你必须意识到这个有三种意思: 1 一个抽象的指南 2 一个具体的实现 3 一个运行时的实例 JVM 的生命周期 每个运行时JVM 实例都是为一个特定 ...