以下只为记录自己工作常用的片段和心得, 如有问题请指正, 多谢~ jQuery/zepto判断元素是否存在 // 判断长度是否存在, 正确 if ($elem.length) { }// 错误, 因为空数组也是true if ($elem) { }合理判断数据类型 先看代码: function case(str) {return str.match(/reg/); } 看着没问题, 但当 str 为空(false, null等)时就挂了, 适当的检查让代码更健壮, 如: function case(str) {return "string" === typeof str ? str.match(/reg/) ...
需求：在APP落地页上的底部位置显示此前其他用户的购买记录，要求此div盒子只显示3条半，但一页有10条，div内的滑动条滑到一页底部自动加载下一页并发加载埋点。 实现：首先理解三个概念，分别是contentH，viewH，scrollTop。 contentH:即所要滑动的元素内容的高度，包括可见部分以及滚动条下面的不可见部分。 ViewH:即我们看到的这个DIV的高度，不包括可见部分也不包括滚动条下面的不可见部分。 scrollTop:即滚动条距离顶部的距离...
最近由于公司项目需要图片查看器，网上搜了一圈，感觉资料很少，所以决定基于百度的touch.js手势库+zepto.js自己写了一个小插件，实现了左右滑动，双指缩放，双击缩放功能，基本使用还行，但是有时候还是不太顺畅，后续会慢慢完善；写的不好的地方望各位能够给出好的建议，谢谢！ 源码地址：https://github.com/GLwen/molong_photoSwipe.git 演示：http://runjs.cn/detail/iceaaogh molong.css *{padding:0;margin: 0;list-style: ...
首先是效果：jquery中有fadeIn和fadeOut两个效果，用来实现渐隐渐显的效果，这个在PC端自然是常用的效果。然后我们前端组的组员Mr Huang自然是想到手机页面也可以更加炫丽，于是加上了登录框的渐隐效果。给用户缓冲的效果不错。但是，zepto中并没有fadeIn和fadeOut，怎么办？难道真的就无法满足Mr Huang的愿望了吗？No. I will do it.在zepto中有个动画效果（animate），用这个效果来实现渐隐还是不错的。咱们引用中文文档中的说明...
dropload.js提供了最基本的上拉翻页，下拉刷新功能。对于由服务端一次返回所有数据的情况基本通用。 但是，需求往往不是服务端一次性返回所有数据，往往还要支持服务端分页，搜索，排序，多条件筛选等功能。（比较类似美团美食的界面）一、解决方案 改进1：由于有分页，搜索，排序，多条件筛选功能，可能都不需要上拉，进到页面就没有数据。 例如：搜索一个服务端不存在的名字。 所以，添加接口设置setHasData。 MyDropLoad.proto...
先看看弹窗效果，如下： //放大图片$(page).on(click,.popupImage img,function () {var that = $(this);that.popupImage({this:that,width:"200px"})});//相册弹窗$.fn.popupImage = function (obj) {var $this = obj.this;var sj_w = $this[0].naturalHeight;var src = $this.attr(src);var h = $(body).height();var w = $(body).width();var padding = 10;var shadeW = w - padding*2;var img = ,shade = ;img = <div class="p...
效果如下：html: <div class="otherPic"><div id="showOtherImage"></div><span class="pull-left position_relative" id="openIdCardImg"><span class="icon color-blue addPic"></span><input type="file" class="yy_inputFile" id="other_inputFile" name="reasonImg" /></span></div> .basicInfo .item{ padding:.5rem .5rem 0; border-top:.3rem solid #eeeeee;} .basicInfo li{ overflow:hidden; margin-bottom:.5rem;lin...
效果如下： <div class="clList overflow-h mt75"><select class="pull-left cl-35 select01" id="cityParent"><option>请选择省</option></select><select class="pull-left cl-35 select02" id="city"><option>请选择市</option></select></div> //测试数据 var _json = [ {"areas" : [ {"name" : "东城区"}, {"name" : "西城区"}, {"name" : "崇文区"}, {"name" : "宣武区"}, {"name" : "昌平区"}, {"name" : "朝阳区"}, {"name...
前言做过移动Web开发的同学都知道，移动端日期选择是很常见的需求。在PC端，我们有很丰富的选择，比较出名的就有Mobiscroll和jQuery UI Datepicker。个人看来，这些插件存在的两个显而易见的问题，第一是过重的依赖，对于jQuery的插件，已经强制依赖了80多k的庞然大物，把很多移动端项目拒之门外；第二是太过强大的功能，很多插件花百分之八十的时间去完善插件百分之二十炫酷的额外功能，导致代码量变大，配置繁杂。所以一款少依赖...
在移动web开发中，由于手机界面较小，为了能展示更多的图片经常使用轮播图并且还需要考虑到手机流量的问题，通过请教他人以及百度，个人感觉swipe.js比较好用。它是一个纯javascript工具，不需要跟其它js库一起导入，同时兼容jQuery和zepto，压缩版的大小只有6kb很适合移动端的开发，它的git地址：https://github.com/thebird/swipe 在git上对其的使用方式介绍的相当清楚，关键代码如下 <div id=slider class=swipe><div class=swi...
老规矩，先贴代码 <script>$(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);})}}); </script> 以上所述就是本文的全部内容了，希望大家能够喜欢。
调用方式 :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...
Zeptogithub地址: https://github.com/madrobby/zepto官方地址: http://zeptojs.com/中文版地址: http://www.css88.com/doc/zeptojs_api/Zepto就是jQuery的移动端版本, 可以看做是一个轻量级的jQuery注意点Zepto的设计目的是提供 jQuery 的类似的API，但并不是100%覆盖 jQueryjQuery的底层是通过DOM来实现效果的， zepto.js 是用css3 来实现的；官网下载的zepto,就已经包含了官网所述的默认模块了github上下载的zepto模块需要自己导...
我正在尝试使用zepto.js将事件处理程序绑定到单击函数.通常在JQuery中我可以说返回false并且实际的点击将永远不会通过. Zepto不支持这个吗？如果是这样,如何解决这个问题？解决方法:要在jQuery事件处理程序中复制返回false的行为,您需要调用event.preventDefault()和event.stopPropagation().
我正在努力提高我对Javascript的理解,所以我一直在浏览Zepto库.我遇到过这一行：uniq = function(array){return array.filter(function(item, idx){return array.indexOf(item) == idx}) }这个功能的目的是什么？据我所知,它正在创建一个新的,独特的元素阵列,对吧？但它本质上只是克隆数组吗？如果是这样,array.slice()会不会更快？ 最后,将array.indexOf(item)更改为array.indexOf(item,idx)会不会提高性能？或者更好,只是回归真实...