keyup 监听在ios设备上输入中文时不触发的解决办法

问题 可能ios输入中文的方法可能是粘贴,所以keyup只能监听到英文的输入,导致keyup监听并没有触发 解决方案 使用input和paste取代keyup的监听 $item.on('input paste', function() { //dosomething }); 参考:http://www.cnb Read»

大量图片的列表,图片延迟加载的实现,监听页面滚动,减少客户端和网络的压力

瀑布什么的这里不讨论,现在课题在同一页面有大量商品的图片,如果一次性在加载页面的时候全以img的形式加载,将耗费大量的带宽和系统资源。所以,以同一张默认图片代替商品图片被加载,可以保证页面显示的速度,然后根据可视范围判断图片是否进行加载,智能自动的判断,保持页面对用户的友好。 京东在这方面做得很好,不仅图片延迟加载,连 Read»

纯前端实现商品筛选功能页面,罗列所有过滤条件,最直观最高效,效果参考京东及淘宝

需求: 实现类似京东及淘宝的商品筛选模式,直观,操作简便。 e.g 现状: 系统没有设置一个标志性的搜索栏; 商品数量不超过1000个; 页面用于商品快捷管理,而非商品买卖,故数据的即时性要求不像京东淘宝那么高; 方案: 选择筛选条件后执行表单提交操作,直接进行页面刷新;(前端开发难度最小,需要后端实现筛选,可能需考 Read»

cropzoom使用及改进笔记,实现图片裁剪功能,兼容高版本jquery,加入自定义参数

之前同事用过一个裁剪控件叫Jcrop,个人感觉操作不够直观,于是决定进行改进,经过对比,最后选择了cropzoom。 资源地址:http://www.js-css.cn/a/jscode/cutpic/2013/1102/1013.html 以下是使用及改进笔记: 兼容问题修正 首先要说的是jQuery版本的兼容问题, Read»

CoolBanner,原创Banner焦点图切换类,滚动切换,附带元素动画切入,动感科技感

需求: Banner焦点图滚动十分流行,我希望把图片与文字分离,先滚动图片再切入文字,这样更富动感和科技感。当然已经有不少网站采用类似的形式,但缺少规范的类。于是,决定动手写一个,而且采用html代码作为元素,使用得当,可支持所有子元素。支持切换时间、动画时间、动画速度自定义。 使用说明: 调用jquery(1.4. Read»

尝试webapp框架模板制作,难点与心得

首次接触zepto.js,轻量的移动开发框架,类似JQuery,所以入门还是比较轻松的。选择学习zepto.js原因很简单,因为轻量简洁。 内部地址:webapp框架模板雏形 项目地址:https://github.com/coolhihi/trywebapp 难点 衰减曲线函数 我观察了安卓APP里的下拉刷新,属于衰 Read»

webapp框架模板雏形

简介 我的想法是沿用PC站前端框架的设计思路,通过AJAX加载新页面内容,利用JS结合HTML5/CSS3特性制作类似AndroidAPP的效果,包括: 下拉刷新 新页面多方向切入 上拉加载更多 消息推送 用到zepto.js 项目地址: https://github.com/coolhihi/trywebapp d Read»

编写一套前端框架,基于jQuery,笔记及心得

这段时间一直在忙某平台的前端改版,目前已调试得比较满意,这个时间,把思路和难点做一下整理,巩固一些知识点。 思路 为节省网络资源,JQuery及用到的插件、公共函数、公共动作监听(采用delegate),均只在首次打开时加载; 定义load方法和reload方法,通过ajax方式实现无闪烁更换内容和伪刷新; 监听所有a Read»

让input框实现类似百度的搜索提示

挺炫的一个效果,百度和谷歌好像已实现好多年了,我以为在网上能轻易找到代码来实现这个效果。真正遇到这个需求,发现还真找不到。html5的<datalist>方便但不实用,且兼容性是大问题,于是自己动手写这个效果,由于我是把效果整合到我的整套框架里,所以没有进行单独的封装。 需求: 实现带提示的input框,类 Read»

通过pjax实现无刷新翻页,兼容新版jquery,使用心得

关于pjax这里就不多介绍了,简单易用,轻松地实现部分刷新,告别链接带来的闪烁。 之前看过pjax并实现了demo,还写了篇笔记,不过jquery 1.9把live()方法删掉了,新版pjax也随之换了用on()方法实现,最近项目有用到,所以了解了新的使用方法,这里也做一个新的笔记。 环境: jquery 1.10.2 Read»