移动端(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 . 黑 ...
随机推荐
- android 通过uri获取bitmap图片并压缩
很多人在调用图库选择图片时会在onActivityResult中用Media.getBitmap来获取返回的图片,如下: Uri mImageCaptureUri = data.getData(); ...
- *POJ1830 高斯消元
开关问题 Time Limit: 1000MS Memory Limit: 30000K Total Submissions: 8010 Accepted: 3161 Description ...
- Daily Scrum02 12.11
今天的会议的主要内容基本是解决界面组的问题,原本开始进行人员分配的时候没有考虑到要花特别长的时间为美化界面整理素材,且由于进行素材PS的同学的时间安排问题,和不熟练,很久没有将素材准备这项任务完成.因 ...
- .保护Express应用程序
毫无疑问,Node.js已经变的愈加成熟,尽管这样,开发者仍然缺乏大量的安全指南.在这篇文章中,我将分享一些有关Node.js安全要点给大家,希望大家能够谨记于心. 1.避免使用Eval Eval并不 ...
- C语言内存分配
(1)代码区(text segment).存放CPU执行的机器指令(machine instructions).通常,代码区是可共享的 (即另外的执行程序可以调用它),因为对于频繁被执行的程序,只 ...
- poj3750-小孩报数问题(约瑟夫环)
一,题意: 中文题.二,思路: 1,输入. 2,无限循环1~n~1~n,直到输出n次,再跳出. 3,输出名字,并标记. 普通模拟版: #include<iostream> #include ...
- 剑指Offer面试题:9.二进制中1的个数
一.题目:二进制中1的个数 题目:请实现一个函数,输入一个整数,输出该数二进制表示中1的个数.例如把9表示成二进制是1001,有2位是1.因此如果输入9,该函数输出2. 二.可能引起死循环的解法 一个 ...
- Linux 配置YUM
标签:MYSQL/linux 概述 文章主要介绍配置163,mysql,epel这三个yum源. 目录 概述 步骤 下载安装包 卸载自带的yum 安装yum包 添加yum 总结 步骤 安装163源 注 ...
- WCF Security基本概念(转载)
WCF Security 主要包括 "Transfer Security"."Access Control"."Auditing" 几个部分 ...
- Fiddler调式使用知多少(一)深入研究
Fiddler调式使用(一)深入研究 阅读目录 Fiddler的基本概念 如何安装Fiddler 了解下Fiddler用户界面 理解不同图标和颜色的含义 web session的常用的快捷键 了解we ...