webapp开发中的一些注意的
和大多数响应式的布局一样,webapp开发也是需要浮动布局和百分比布局,需要考虑的是小屏幕手机250px和大屏幕设备768px,但是习惯以320px和640px来分割,jq中的一句话$(function(){
$(window).resize(function() {
var isWidescreen=$(this).width();
if(isWidescreen<320){
isWidescreen=320;
}else if(isWidescreen>640){
isWidescreen=640;
}
var ratio = isWidescreen / 320;
$(".w640").css({'font-size': ratio * 16+"px" });
}).trigger('resize');
可以检测移动设备width。
使用到Ovflow-y:scroll属性时;要注意设置为absolute;超出部分可以滚动,之前为了固定头尾部,使用了fixed属性,但是在苹果手机里不兼容,然后用了js动态为需要固定的元素设置top和bottom值,window.scrollY,发现手机打开滑动到头部和尾部的时候页面抖动厉害;然后为了解决这个问题,使用了ovflow:scroll;哎,饶了好大一个弯,也算是教训吧
webapp开发中的一些注意的的更多相关文章
- 【原】webapp开发中兼容Android4.0以下版本的css hack
话说现在的手机型号越来越多,主要还是android和ios这2个巨头称霸了江湖,而他们自带的浏览器内核是webkit,那对于做移动网页开发的同事来说,一般只要做好webkit内核浏览器的展现效果就行了 ...
- webApp开发中的总结
meta标签: H5页面窗口自动调整到设备宽度,并禁止用户缩放页面 <meta name="viewport" content="width=device-wid ...
- WebApp 开发中常用的代码片段
其实这里面的多数都是 iOS 上面的代码.其他平台的就没有去验证了. HTML, 从HTML文档的开始到结束排列: <meta name=”viewport” content=”width=de ...
- 移动端WEBAPP开发遇到的坑,以及填坑方案!持续更新~~~~
前言:在移动端WEBAPP开发中会遇到各种各样的问题,通过此文对遇到的问题做一个归纳总结,方便自己日后查询,也给各位前端开发友人做一个参考. 此文中涉及的问题是本人开发中遇到的,解决方案是本人思考 ...
- web移动开发中如何实现图标点击态的蒙层效果
webapp开发中经常需要加入点击二态,即用户点击(tap)页面某个部分时该部分的样式进行相应的变化来相应用户的点击操作,这样能够带来更好的用户体验,今天我们要讨论的是如何给图标加上点击的二态效果. ...
- 【blade利刃出鞘】一起进入移动端webapp开发吧
前言 在移动浪潮袭来的时候,小钗有幸进入框架组做webapp框架开发,过程中遇到了移动端的各种坑,也产生了各种激情,就我们公司的发展历程来说 第一阶段:使用传统方式开发移动站点,少量引入HTML5元素 ...
- webapp开发调试环境--weinre配置
用谷歌调试工具中的手机模拟器模拟手机进行webapp的开发,与真机上的效果还是有些偏差,opera手机模拟器的效果亦不佳.有时在pc上开发出来的webapp效果良好,在部分真机上就出现了偏差,这时候就 ...
- (转) 浅析HTML5在移动应用开发中的使用
(转)浅析HTML5在移动应用开发中的使用 (原)http://www.iteye.com/magazines/67 2012-03-07 来自 UECD.163.com 编辑 wangguo ...
- webapp开发需要注意的浏览器内核知识
Web App:1.开发成本较低使用web开发技术就可以轻松的完成web app的开发2.升级较简单升级不需要通知用户,在服务端更新文件即可,用户完全没有感觉3.维护比较轻松和一般的web一样,维护比 ...
随机推荐
- 【转载】Delphi7从子线程中发送消息到主线程触发事件执行
在对数据库的操作时,有时要用一个子线程来进行后台的数据操作.比如说数据备份,转档什么的.在主窗口还能同是进行其它操作.而有时后台每处理一个数据文件,要向主窗口发送消息,让主窗口实时显示处理进度在窗口上 ...
- jQuery MiniUI开发系列之:安装部署
jQuery MiniUI是一套纯Javascript的WebUI控件库,它由几十个Javascript控件组成,是不依赖服务端和数据库的. 下载jQuery MiniUI,解压缩后,开发者可以直接在 ...
- 【HOW】如何对Reporting Services表格中数据按字段排序
Reporting Services中可以设置排序的地方非常多,有很多地方从其字面意思上好像是对表格数据的排序,但实际都不管用.在多次尝试后,得到如下的有效设置方式: 1. 鼠标右键单击要排序字段的内 ...
- Phoenix -修复表索引
索引的修复可以通过2种方式,(关于pehoenix的索引的生命周期可以参考 https://community.hortonworks.com/articles/58818/phoenix-inde ...
- SpringMVC国际化
如何将我们网站的其它内容(如菜单.标题等)做国际化处理呢?这就是本篇要将的内容->国际化. 一.基于浏览器请求的国际化实现: 首先配置我们项目的springservlet-config.xml文 ...
- GAudio是一个音频播放SDK
gaudio是一个基于C/C++混合编程的跨平台音频库,当前支持windows32/64操作系统 免费使用 - 有问题和建议请联系 谢谢 修改记录1.2013.04.01 初次发布2.2013. ...
- SVN show log failed
Q: SVN 不能显示日志 能正常update, commit,但是show log的时候报错 A:可能原因是服务器权限配置问题 修改配置文件svnserve.conf 和 authz, 修改前请先备 ...
- JAVA Socket 编程学习笔记(一)
1. Socket 通信简介及模型 Java Socket 可实现客户端--服务器间的双向实时通信.java.net包中定义的两个类socket和ServerSocket,分别用来实现双向连接的cli ...
- Struts2从一个action转到另一个action的两种方法
在Struts2中,Action处理完用户请求后,将会返回一个字符串对象,这个字符串对象就是一个逻辑视图名.Struts 2通过配置逻辑视图名和物理视图之间的映射关系,一旦系统收到Action返回的某 ...
- 深入理解CSS溢出overflow & overflow:hidden真的失效了吗[转载]
深入理解CSS溢出overflow http://www.cnblogs.com/xiaohuochai/p/5289653.html overflow:hidden真的失效了吗 http://www ...