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一样,维护比 ...
随机推荐
- CSS第二章
1. 文本与字体属性: text-decoration:文本修饰线 none(去除修饰线).underline(下划线).overline(上划线).line-through(删除线) color: ...
- MySQL Workbench “Error Code: 1175” 的解决方法
转自:http://www.linuxidc.com/Linux/2012-04/59333.htm 当用MySQL Workbench进行数据库的批量更新时,执行一个语句会碰到以下错误提示: Err ...
- PHP命名空间的作用、为什么使用命名空间?
命名空间一个最明确的目的就是解决重名问题,PHP中不允许两个函数或者类出现相同的名字,否则会产生一个致命的错误.这种情况下只要避免命名重复就可以解决,最常见的一种做法是约定一个前缀. 举个栗子:项目中 ...
- linux查看父子进程
python多进程代码 http://blog.csdn.net/yfkiss/article/details/6729364 Linux下多线程查看工具(pstree.ps.pstack) tes ...
- Loadrunner---解决乱码问题
在使用Loadrunner录制和回放时有时候会因为乱码问题报错,且让我们很难定位出脚本问题所在.此事我们做一下分析loadrunner为什么会出现乱码这种情况呢? 1.乱码产生的原因 1)loadru ...
- 安装spf13-vim on Windows10
安装之前 1.系统为 windows10 Version 1607 64位 企业版 2.参考 http://www.codeweblog.com/gvim-64%E4%BD%8D-windows-7 ...
- web开发以及分布式开发C/S B/S系统结构
分布式开发,由客户端发送请求给服务端,经服务端进行请求处理后返回处理结果(远程方法调用),在客户端发送请求,获取httpclient/okclient对象,传入参数(URL以及其余参数等),发送请求 ...
- GNS3 桥接虚拟网卡 telnet 实验
网上很多桥接本地网卡的,一直测试不通.无奈,本人桥接vmware 虚拟网卡通! 1: 2: 3:telnet 加密实验 R1(config)#line vt R1(config)#line vty 0 ...
- 用JS实现九九乘法表
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- 外网无法访问本地IIS站点
自己申请了个花生壳动态域名,本来是打算在IIs上建个站点测试一下的,路由器上的端口也配置好了,把80端口指向我本机.域名也通过 ping 测试确实指向了我这里的路由器.但是用这个域名老是访问不了我这个 ...