移动端(h5)开发笔记
1.禁止缩放+禁止缓存
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1" />
<meta http-equiv="pragma" content="no-cache" />
<meta http-equiv="cache-control" content="no-store, must-revalidate" />
<meta http-equiv="expires" content="0" />
</head>
2.-webkit-定制css
更多参考:http://www.cnblogs.com/radom/archive/2012/04/19/2457356.html
-webkit-touch-callout:none;
-webkit-user-select:none;
-webkit-text-size-adjust:none;
-webkit-tap-highlight-color:rgba(0,0,0,.1);/*链接触感样式*/
3.获取浏览器及webview系统/版本信息
//MIUI
Mozilla/5.0 (Linux; U; Android 4.1.1; zh-cn; MI 2 Build/JRO03L) AppleWebKit/537.36 (KHTML, like Gecko) Version/4.0 Mobile Safari/537.36 XiaoMi/MiuiBrowser/2.1.1 //weixin
Mozilla/5.0 (Linux; U; Android 4.1.1; zh-cn; MI 2 Build/JRO03L) AppleWebKit/533.1 (KHTML, like Gecko)Version/4.0 MQQBrowser/5.4 TBS/025440 Mobile Safari/533.1 MicroMessenger/6.2.2.54_rec1912d.581 NetType/WIFI Language/zh_CN //QQ
Mozilla/5.0 (Linux; U; Android 4.1.1; zh-cn; MI 2 Build/JRO03L) AppleWebKit/533.1 (KHTML, like Gecko)Version/4.0 MQQBrowser/5.4 TBS/025442 Mobile Safari/533.1 V1_AND_SQ_5.7.2_260_YYB_D QQ/5.7.2.2490 NetType/WIFI WebP/0.3.0 //UC
Mozilla/5.0 (Linux; U; Android 4.1.1; zh-CN; MI 2 Build/JRO03L) AppleWebKit/534.30 (KHTML, like Gecko) Version/4.0 UCBrowser/10.4.1.576 U3/0.8.0 Mobile Safari/534.30 //weibo
Mozilla/5.0 (Linux; U; Android 4.1.1; zh-cn; MI 2 Build/JRO03L) AppleWebKit/534.30 (KHTML, like Gecko) Version/4.0 Mobile Safari/534.30 Weibo (Xiaomi-MI 2__weibo__5.4.0__android__android4.1.1) //SohuNews
Mozilla/5.0 (Linux; U; Android 4.1.1; zh-cn; MI 2 Build/JRO03L) AppleWebKit/534.30 (KHTML, like Gecko) Version/4.0 Mobile Safari/534.30 SohuNews/5.2.3 BuildCode/95
4.PC端mousemove和移动端的touchmove target的区别
一个划线程序,div.que划线到div.ans,需要判断是否move到了目标位置。
PC通过判断mousemove的e.target做了实现,但是到了pad上无效了。pad上无论手指移动到什么位置,touchmove的e.touches[0].target始终为touchstart时的target。
如此一来,pad上的实现就必须要通过判断move的坐标是否落在目标坐标范围内了。
思考:
得理解pad和PC的交互区别,PC上可以判断鼠标经过得知经过了那些元素。但是pad上,手指头经过肯定是,按下+移动,类似于PC上的拖拽,这样的话,事件目标肯定是当前拖拽的元素,不会跟着move而改变的。
webview
1.文件选择
Android原生不支持fileInput的文件选择
移动端(h5)开发笔记的更多相关文章
- 移动端H5开发自适应技巧
移动端H5开发,必要要做到自适应各种分辨率的手机,下面由我为大家大致说一下,需要3步走 第一:head标签中添加: <meta name="viewport" content ...
- 移动端H5开发遇到的问题及解决方法
本篇文章给大家带来的内容是关于移动端H5开发遇到的问题及解决方法,有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助. 微信分享签名错误invalid signature vue单页应用hi ...
- 移动端h5开发相关内容总结css篇--笔记
原文参考http://mp.weixin.qq.com/s/Nho2DHj-Y59j2F62vpN9jQ 1.开发移动端,头部必要的配置<meta name="viewport&quo ...
- 移动端 h5开发相关内容总结(三)
之前写过两篇开发中遇到的问题和解决方案.当时是CSS 和 JavaScript 分开写的.现在写这篇文章的时候感觉很多内容都是有内在联系的,所以不好分开. 给大家分享一下这半年来的感受吧: 知道和理解 ...
- 转---移动端 h5开发相关内容总结——CSS篇
作者:伯乐在线专栏作者 - zhiqiang21 如有好文章投稿,请点击 → 这里了解详情 如需转载,发送「转载」二字查看说明 1.移动端开发视窗口的添加 h5端开发下面这段话是必须配置的 meta ...
- 移动端 h5开发相关内容总结——CSS篇
1.移动端开发视窗体的加入 h5端开发以下这段话是必须配置的 <meta name="viewport" content="width=device-width, ...
- 移动端 h5 开发相关内容总结——JavaScript 篇
1.改变页面标题的内容 有时候我们开发 h5页面的时候须要动态的去更新title 的名字,这个时候使用 document.title='改动后的名字'; 就行解决我们的问题. 或者使用 //当前fir ...
- 移动端H5开发 (滑动事件)
最近一直在做手机App H5的开发,在开发过程中,经常会遇到很多滑动事件,写个demo,分享自己的一些写法.(如写的不好,轻喷!) 直接贴代码 html css代码 <!DOCTYPE html ...
- 移动端H5开发 之 渲染引擎
渲染引擎 浏览器渲染引擎,负责解析 HTML, CSS,javascript的DOM部分,如桌面浏览器一般手机端也有4个比较重要的渲染引擎 Gecko,Trident,WebKit,Blink . 黑 ...
随机推荐
- *HDU1846HDU2188 巴什博奕
Brave Game Time Limit: 1000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others)Total ...
- 关于兼容IE的一些策略
--css 盒子模型下的 box-sizing 属性,只兼容到ie8: -moz-box-sizing: border-box; -webkit-box-sizing: border-box; -o- ...
- Kafka设计解析(五)- Kafka性能测试方法及Benchmark报告
本文转发自Jason’s Blog,原文链接 http://www.jasongj.com/2015/12/31/KafkaColumn5_kafka_benchmark 摘要 本文主要介绍了如何利用 ...
- Des与3Des加密解密
/// <summary> /// Des和3Des算法 /// </summary> public class Des { /// <summary> /// D ...
- wdk中ramdisk代码解读
入口函数,即驱动加载函数 NTSTATUS DriverEntry( IN PDRIVER_OBJECT DriverObject, IN PUNICODE_STRING RegistryPath ) ...
- Mvc form提交
在项目开发中,我们离不开表单提交,本篇主要记录mvc的Ajax.BeginForm提交方式. 需要用到的js @Url.Script("~/Content/Scripts/jquer ...
- Python读写文件
Python读写文件1.open使用open打开文件后一定要记得调用文件对象的close()方法.比如可以用try/finally语句来确保最后能关闭文件. file_object = open('t ...
- 2013年度IT博客大赛跻身10强
2013年12月26日,由51CTO独家举办的2013年度IT博客大赛圆满落幕,荣幸跻身10强[http://fellow.51cto.com/art/201312/425528.htm],首先感谢各 ...
- Android安全开发之通用签名风险
Android安全开发之通用签名风险 作者:伊樵.舟海.呆狐@阿里聚安全 1 通用签名风险简介 1.1 Android应用签名机制 阿里聚安全漏洞扫描器有一项检测服务是检测APP的通用签名风险.And ...
- Redis系列(五)-Opserver的监控
阅读目录: 基本介绍 使用配置 部署实例 面板属性 基本介绍 Opserver是Stack Exchange的一个开源监控系统,基于Net.MVC开发,所以Net程序员可以轻松基于它二次开发.它主要监 ...