很多人都听说过zepto，但是很多人不知道zepto是什么意思？下面我们来总结一下zepto。一：zepto是什么意思zepto是一种高级浏览器js库，并且和jquery的api很相似，会使用jquery就一定会使用zepto，Zepto是一款开源软件，zepto的主要目的就是有一个通用库，并且下载速度快。二：zepto使用方法，我们可以使用script标签在页面的底部引用一个zepto文件，例如： </body><script src=./js/zepto.min.js></script></html>在移动端我们不需要...
zepto和jquery的区别有哪些？本篇文章就给大家介绍zepto是什么？zepto和jquery的区别，让大家对zepto有一个了解，知道zepto和jquery的区别是什么，希望对你们有所帮助。zepto是什么？Zepto是一个基于jQuery库的现代浏览器的极简主义JavaScript库。Zepto的API和语法与jQuery的API和语法相同，所以如果你知道jQuery，你就知道Zepto了。Zepto是一个真正的移动优化库，它对于完整的Javascript库来说，是一个非常小的文件大小，非常适合...
Zepto是一个轻量级的针对现代高级浏览器的JavaScript库， 它与jquery有着类似的api。 如果你会用jquery，那么你也会用zepto。Zepto.js是什么？Zepto.js是一个轻量的js库，它与jQuery有类似的API。zepto的设计目的是不到10K的通用库，快速下载，有一个熟悉的api-->精力专注在开发上。流行起来的原因：1、轻量；2、只支持现代浏览器。3、非常方便的搭配其他框架（phoneGap）来编写代码；4、优秀的源代码，性能良好。zepto.js源码解析...
Callback模块是用来管理回调函数，也作为deferred延迟对象得基础部分，现在一起来看看他的源码。可选参数： Options:once: 是否最多执行一次，memory: 是否记住最近的上下文和参数stopOnFalse: 当某个回调函数返回false时中断执行unique: 相同得回调只被添加一次这是可选参数，下面可以进行试验：var a = function (value) {console.log(a: + value); }; var b = function (value) {console.log(b: + value); }; var callbacks = ...
移动端用zepto做的页面，突然发现on绑定的click事件并没有触发，代码如下：<ul> <li class="a">1111111aaaaaaasssss</li> <li class="b">aaaaaaassssss</li> <li class="c">ssssssss</li> </ul> <script>$(document).on(click,.c,function(argument) { alert($(this).html()) }) </script>我把此写法改成非事件委托的方式，发现该click事件就能触发$(‘.a’).on(click,function(argument) { alert($(this).html()) })...
Gesture 模块基于 IOS 上的 Gesture 事件的封装，利用 scale 属性，封装出 pinch 系列事件。源码版本本文阅读的源码为 zepto1.2.0GitBook《reading-zepto》整体结构;(function($){if ($.os.ios) { var gesture = {}, gestureTimeout$(document).bind(gesturestart, function(e){...}).bind(gesturechange, function(e){...}).bind(gestureend, function(e){...});[pinch, pinchIn, pinchOut].forEach(function(m){$.fn[m] = fun...
前言做过移动Web开发的同学都知道，移动端日期选择是很常见的需求。在PC端，我们有很丰富的选择，比较出名的就有Mobiscroll和jQuery UI Datepicker。个人看来，这些插件存在的两个显而易见的问题，第一是过重的依赖，对于jQuery的插件，已经强制依赖了80多k的庞然大物，把很多移动端项目拒之门外；第二是太过强大的功能，很多插件花百分之八十的时间去完善插件百分之二十炫酷的额外功能，导致代码量变大，配置繁杂。所以一款少依赖...
本文实例讲述了zepto.js中tap事件阻止冒泡的实现方法。分享给大家供大家参考。具体如下： 最近在弄一个手机版的网站，本来想用jQuery Mobile，但文件太大了，所以用了zepto.js 由于移动网页中使用click事件会有延迟，所以就用上了zepto.js中的tap事件。 使用click事件可以使用stopPropagation来阻止冒泡，但tap使用该方法无效 现在我需要实现这样一个效果：点击a.btn这个按钮，然后显示div.panel，当我点击非div.panel时隐藏div.pa...
调用方式 :ImageView(index,imgData) --index参数 为图片默认显示的索引值，类型 为Number --imaData参数 为图片url数组 ，类型为Array 使用之前要先引入 zepto.js 文件 ImageView.js具体代码如下：代码如下: /** ImageView v1.0.0* --基于zepto.js的大图查看* --调用方法 ImageView(index,imgDada)* --index 图片默认值显示索引,Number --imgData 图片url数组,Array* */ var ImageView=(function(window,$){var _this=$("#slid...
老规矩，先贴代码$(function(){window.onload = function(){var $li = $('.taocan-title li');var $ul = $('.taocan-content .con110');$li.mouseover(function(){var $this = $(this);var $t = $this.index();$li.removeClass();$this.addClass('active');$ul.css('display','none');$ul.eq($t).css('display','block');})}});以上所述就是本文的全部内容了，希望大家能够喜欢。
在移动web开发中，由于手机界面较小，为了能展示更多的图片经常使用轮播图并且还需要考虑到手机流量的问题，通过请教他人以及百度，个人感觉swipe.js比较好用。它是一个纯javascript工具，不需要跟其它js库一起导入，同时兼容jQuery和zepto，压缩版的大小只有6kb很适合移动端的开发，它的git地址：https://github.com/thebird/swipe 在git上对其的使用方式介绍的相当清楚，关键代码如下.swipe {overflow: hidden;visibility: hidde...
如下所示：$(#phone).on(input, function(e) {//实时监听手机号码输入框变化if($(#phone).val()) {//输入框内容不为空}else{//输入框内容为空}})change事件是在失去焦点的时候生效的。使用input可以很简单的实现输入框的实时监听 以上这篇zepto.js 实时监听输入框的方法就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持脚本之家。
最近使用Zepto.js写的登陆界面，纯js界面，留下来，以后再写登陆可以直接使用了。下面是效果图直接再html中先引入zepto.js的库，再插入下面的代码就可以实现了 createLoginArea(); function createLoginArea() { var field = $(<fieldset />); field.css({ position:absolute, width:60vmin, height:40vmin, border: 1px solid #61B5CF }); field.css(border-radius,1vmin); var legend = $(<legend />); legend.text("登陆"); va...
看完老师的视频做的一个手机相册，对我这种菜鸟来说还是直接上代码吧！里面用到17张小图，17张大图，还有animate.css和zepto.min.js ,都可以在网上找到。 <!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="UTF-8"> <!-- <meta name="viewport" content="width=device-width,initial-scale=1.0,user-scalable=no"/> --> <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0"/> <ti...
效果图：代码如下： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <script type="text/javascript" src="http://www.xipwang.cn/js/zepto.min.js"></script> </head> <body> <div class="ui-password"><input type="password" name="" class="passwords"><button class="seepassword" >查看密码</button> </div> <script type="text/javascript">$(function(){(function(){$.fn.showp...