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)开发笔记的更多相关文章

  1. 移动端H5开发自适应技巧

    移动端H5开发,必要要做到自适应各种分辨率的手机,下面由我为大家大致说一下,需要3步走 第一:head标签中添加: <meta name="viewport" content ...

  2. 移动端H5开发遇到的问题及解决方法

    本篇文章给大家带来的内容是关于移动端H5开发遇到的问题及解决方法,有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助. 微信分享签名错误invalid signature vue单页应用hi ...

  3. 移动端h5开发相关内容总结css篇--笔记

    原文参考http://mp.weixin.qq.com/s/Nho2DHj-Y59j2F62vpN9jQ 1.开发移动端,头部必要的配置<meta name="viewport&quo ...

  4. 移动端 h5开发相关内容总结(三)

    之前写过两篇开发中遇到的问题和解决方案.当时是CSS 和 JavaScript 分开写的.现在写这篇文章的时候感觉很多内容都是有内在联系的,所以不好分开. 给大家分享一下这半年来的感受吧: 知道和理解 ...

  5. 转---移动端 h5开发相关内容总结——CSS篇

    作者:伯乐在线专栏作者 - zhiqiang21 如有好文章投稿,请点击 → 这里了解详情 如需转载,发送「转载」二字查看说明 1.移动端开发视窗口的添加 h5端开发下面这段话是必须配置的 meta ...

  6. 移动端 h5开发相关内容总结——CSS篇

    1.移动端开发视窗体的加入 h5端开发以下这段话是必须配置的 <meta name="viewport" content="width=device-width, ...

  7. 移动端 h5 开发相关内容总结——JavaScript 篇

    1.改变页面标题的内容 有时候我们开发 h5页面的时候须要动态的去更新title 的名字,这个时候使用 document.title='改动后的名字'; 就行解决我们的问题. 或者使用 //当前fir ...

  8. 移动端H5开发 (滑动事件)

    最近一直在做手机App H5的开发,在开发过程中,经常会遇到很多滑动事件,写个demo,分享自己的一些写法.(如写的不好,轻喷!) 直接贴代码 html css代码 <!DOCTYPE html ...

  9. 移动端H5开发 之 渲染引擎

    渲染引擎 浏览器渲染引擎,负责解析 HTML, CSS,javascript的DOM部分,如桌面浏览器一般手机端也有4个比较重要的渲染引擎 Gecko,Trident,WebKit,Blink . 黑 ...

随机推荐

  1. QQ表情的发送与接收

    我想大家对QQ表情一定不会陌生,一个个小头像极大丰富了聊天的乐趣,使得聊天不再是简单的文字叙述,还能够配上喜.怒.哀.乐等表达人物心情的小图片.本文重点要介绍的内容就是如何在微信公众平台使用QQ表情, ...

  2. OPENDATASOURCE读取远程数据库数据中文乱码问题-sqlserver R2

    insert into kraft_sync_Store(StoreName,StoreCode,Province,PrefectureCity,CountyCity,Region,Area,Unit ...

  3. JDBC增删改查简单测试

    首先编写一个entity以便与数据库表文件相对应 lyTable.java public class LyTable implements java.io.Serializable { private ...

  4. ffmpeg编译与移植问题

    1.下载ffmpeg. 下载网址:http://www.ffmpeg.org/download.html 2.解压缩 tar -zxvf ffmpeg-2.0.1.tar.gz 3.配置,生成Make ...

  5. 学习笔记：java并发编程学习之初识Concurrent

    一.初识Concurrent 第一次看见concurrent的使用是在同事写的一个抽取系统代码里,当时这部分代码没有完成,有许多的问题,另一个同事接手了这部分代码的功能开发,由于他没有多线程开发的经验 ...

  6. 轻量级通信引擎StriveEngine —— C/S通信demo(2) —— 使用二进制协议 （附源码）

    在网络上,交互的双方基于TCP或UDP进行通信,通信协议的格式通常分为两类:文本消息.二进制消息. 文本协议相对简单,通常使用一个特殊的标记符作为一个消息的结束. 二进制协议,通常是由消息头(Head ...

  7. 【转】我的技术学习方法 — Anytao

    原文作者:anytao—王涛 他的著作:<你必须知道的.Net> 关于这个问题,也有不少刚刚入行的朋友向我问起.我想可能一千个人就有一千个答案,我不能保证自己的想法适合于所有的人,但是这确 ...

  8. Log4net入门使用

    简介 几乎所有的大型应用都会有自己的用于跟踪调试的API.因为一旦程序被部署以后,就不太可能再利用专门的调试工具了.然而一个管理员可能需要有一套强大的日志系统来诊断和修复配置上的问题. 经验表明,日志 ...

  9. 有关bootstrap

    最近在接触对移动浏览器很友好的bootstrap,遂整理了一点笔记: 简单的html页面: <!DOCTYPE html><html> <head> <tit ...

  10. Chrome开发者工具不完全指南（四、性能进阶篇）

    前言 Profiles面板功能的作用主要是监控网页中各种方法执行时间和内存的变化,简单来说它就是Timeline的数字化版本.它的功能选项卡不是很多(只有三个),操作起来比较前面的几块功能版本来说简单 ...