zepto.js介绍(持续更新)
前言:
zepto是一个简化版的jQuery,主要针对移动端开发。
简化了jQuery里很多的浏览器兼容性代码,jQuery的很多方法都被拿掉了(eg:slideUp)。
WP设备兼容性很差。
目前还不够完善,开发中总会遇到一些问题,下面简单列举2个开发中遇到的问题:
1.animate方法:
问题:
WP设备中,回调方法不会等待动画执行完后再执行,而是和动画同步执行。
代码:
$('#selector').animate({ 'width': '60%' }, 300, function() {
$('#xx-button').show();
})
原因:
zepto里的animate方法实现机制和jQuery不同,zepto是基于css3的动画,而jQuery是基于队列缓存机制
解决:
用css3的动画实现代替animate方法,eg:animate、tranform等。
2.tap事件穿透:
问题:
当两个元素重叠在一起,且都绑定了zepto的tap事件时,点击上一层元素时会触发下一层的事件,特别当下一层是input框时,必"穿透"。
代码:
$('#selector').on('tap', function() {
// do something
})
原因:
Google的解释:tap事件冒泡到body上时才触发。
解决:
- 使用github的fastclick库。
- 监听touchend事件,使用preventDefault()阻止冒泡。
- 使用css3的pointer-events=true,pointer-events=none切换。
- 如果还不行,建议使用click代替tap。
PS:
移动端开发(WebApp、hybrid)中可以使用zepto,不过还是得谨慎。
zepto.js介绍(持续更新)的更多相关文章
- zepto.js介绍
是一个阉割版的jQuery zepto不支持jQuery过于复杂的选择器,比如:first :last :eq zepto如果要用动画必须再次引包 zepto能将css3中transition支持的动 ...
- maven常用命令介绍(持续更新)
一.Maven的基本概念 主要服务于基于Java平台的项目构建,依赖管理和项目信息管理. 1.1.项目构建 项目构建过程包括[清理项目]→[编译项目]→[测试项目]→[生成测试报告]→[打包项目]→[ ...
- StringUtils工具类常用方法介绍(持续更新)
StringUtils方法的操作对象是java.lang.String类型的对象,是JDK提供的String类型操作方法的补充,并且是null安全的(即如果输入参数String为null则不会抛出Nu ...
- Phoenix介绍(持续更新)
现有hbase的查询工具有很多如:Hive,Tez,Impala,Shark/Spark,Phoenix等.今天主要记录Phoenix. phoenix,中文译为“凤凰”,很美的名字.Phoenix是 ...
- 【前端】Util.js-ES6实现的常用100多个javaScript简短函数封装合集(持续更新中)
Util.js (持续更新中...) 项目地址: https://github.com/dragonir/Util.js 项目描述 Util.js 是对常用函数的封装,方便在实际项目中使用,主要内容包 ...
- 【 js 基础 】【 源码学习 】源码设计 (持续更新)
学习源码,除了学习对一些方法的更加聪明的代码实现,同时也要学习源码的设计,把握整体的架构.(推荐对源码有一定熟悉了之后,再看这篇文章) 目录结构:第一部分:zepto 设计分析第二部分:undersc ...
- Ext JS学习第十六天 事件机制event(一) DotNet进阶系列(持续更新) 第一节:.Net版基于WebSocket的聊天室样例 第十五节:深入理解async和await的作用及各种适用场景和用法 第十五节:深入理解async和await的作用及各种适用场景和用法 前端自动化准备和详细配置(NVM、NPM/CNPM、NodeJs、NRM、WebPack、Gulp/Grunt、G
code&monkey Ext JS学习第十六天 事件机制event(一) 此文用来记录学习笔记: 休息了好几天,从今天开始继续保持更新,鞭策自己学习 今天我们来说一说什么是事件,对于事件 ...
- BAT 前端开发面经 —— 吐血总结 前端相关片段整理——持续更新 前端基础精简总结 Web Storage You don't know js
BAT 前端开发面经 —— 吐血总结 目录 1. Tencent 2. 阿里 3. 百度 更好阅读,请移步这里 聊之前 最近暑期实习招聘已经开始,个人目前参加了阿里的内推及腾讯和百度的实习生招聘, ...
- 总结js常用函数和常用技巧(持续更新)
学习和工作的过程中总结的干货,包括常用函数.常用js技巧.常用正则表达式.git笔记等.为刚接触前端的童鞋们提供一个简单的查询的途径,也以此来缅怀我的前端学习之路. PS:此文档,我会持续更新. Aj ...
随机推荐
- 基于百度地图api + AngularJS 的入门地图
转载请注明地址:http://www.cnblogs.com/enzozo/p/4368081.html 简介: 此入门地图为简易的“广州大学城”公交寻路地图,采用很少量的AngularJS进行inp ...
- Python之路Day19
志不坚者智不达. 主要内容:Django分页.自定义simpletag.权限管理 Django分页 Django自带了一个分页功能,使用起来很方便.官方文档 先来看一下效果图: 后台代码: def c ...
- django-celery提供给顾客使用实例
导入数据库 from djcelery import models as celery_models celery_models.PeriodicTask.objects.create(...) ...
- (IOS)截图Demo
思路是建一个UIView的子类,获取划动出的矩形,用协议将矩形传递给代理对象,依据该矩形完成图像数据的截取,并显示出来. 截图视图类: #import <UIKit/UIKit.h> @p ...
- (转)requirejs:杏仁的优化(almond)
使用场景 什么情况下需要使用 almond 呢?假设你手头有个基于requirejs的小项目,所有业务代码加起来就几十K(压缩后可能更小).出于性能优化的考虑,你可能在想:如果能够去掉requirej ...
- C++惯用法:通过成员模板实现隐式转换(Coercion 强迫 by Member Template)
Intent To increase the flexibility of a class template's interface by allowing the class template to ...
- 周根项《一分钟速算》全集播放&下载地址
点击图片就可以观看 ↓↓↓↓↓↓↓↓ 第1章:指算法 周根项<一分钟速算>第1章:指算法 第一节 对手的认识 周根项<一分钟速算>第1章:指算法 第二节 个位数比十位数大1乘以 ...
- Python模拟登陆
模拟人人登陆 #encoding=utf-8 import urllib2 import urllib import cookielib def renrenBrower(url,user,passw ...
- HDU 1862 EXCEL次序 (排序水问题)
Problem Description Excel对能够记录一组由任意列排序指定.现在,请把你编译的代码类似特征. Input 測试输入包括若干測试用例. 每一个測试用例的第1行包括两个整数 N ...
- 【转】URL和URI的区别
[转]URL和URI的区别 译者:华科小涛:http://www.cnblogs.com/hust-ghtao/: 初学http协议,就被这两个相似的术语搞蒙了,查了很多资料,总算搞清楚了.(找资料还 ...