文章标签 ‘jQuery’
页面中图片过多能够让图片延迟加载会大大提高页面的加载速度,提高用户可用性。 1、有的页面是页面过长或过宽,可以考虑只加载显示区域附近的图片。 2、图片所在窗口不显示,比如Tab内容切换,内容轮播等也要考虑把没有显示的图片延迟加载 第一种情况推荐使用jQuery.LazyLoad插件。 jQuery.LazyLoad.js插件使用方法非常简单 页面头引入js文件 使用对所有图片都使用延迟加载 或者使用选择符给部分图片延迟加载如下 设置敏感性,也就是距离边界的距离,默认是0 设置点位图片 设置图片加载事件:这里可以设置一切jQuery的事件,也可以自定义事件名称 设置图片加载效果 更新详细的使用方法请移步官方http://www.appelsiini.net/projects/lazyload 第二种情况隐藏区域内容的图片,上面的插件就不起作用了这里可以考虑作如下处理 标签如下: 可以通过HTML5验证。
运行效果图 特点一,功能全,常用的基本功能都有了 如果你们的项目正好是基于jQuery,可以考虑使用这个插件,功能很全,可是体积很小哦 特点二,文件小,看看文件大小(我倒是觉得这个特点最招人爱) 特点三、不算特点的特点也支持所有主流浏览器(6.0+, FF 1.5+, Safari 4+, Chrome 5+ and Opera 10+) 这款编辑器基本可以满足广大人.民.群众的基本需求了,你可以试试 官方地址 CLEditor http://premiumsoftware.net/cleditor/
//equal array in jQuery jQuery.fn.compare = function(t) { if (this.length != t.length) { return false; } var a = this.sort(), b = t.sort(); for (var i = 0; t[i]; i++) { if (a[i] !== b[i]) { return false; } } return true;}; 整理自 http://stackoverflow.com/questions/1773069/using-jquery-to-compare-two-arrays
jQuery.slide版本更新到5.0,增加切换步长,step 目前jQuery.slide支持自动切换,循环播放,可控制切换步长功能 jQuery.slide.5.0效果演示 http://www.radys.cn/demos/jquery.slide.5.0/ 历史版本效果演示 jQuery.slide.4.0 http://www.radys.cn/demos/jquery.slide.4.0/ jQuery.slide.3.0 http://www.radys.cn/demos/jquery.slide.3.0/ 如果你使用中有任何问题欢迎留言或发EMail给我。
在学习javascript的时候,下面几个问题需要重点认识一下 1、javascript回调函数 2、跨站请求Cross Domain 3、类 4、设计模式 5、命名空间 6、各种浏览器标准 7、算法 8、代码优化 以上需要时间一一解决,下面几种javascript常用功能则需要好好总结。 1、运功效果(包括图片切换,Tab切换等等) 2、异步传输加载数据(异步加载用户信息等) 3、客户端数据验证 4、客户端数据处理(JSON,DOM等) 这些功能都是非常常用的功能需要整理和优化。
一个Slide Show效果 jQuery slide show <div class="zn_gather"> <div class="picS" style="display:block;">内容一</div> <div class="picS" style="display:none;">内容二</div> <div class="picS" style="display:none;">内容三</div> <div class="picS" style="display:none;">内容四</div> <div class="picS" style="display:none;">内容五</div> <div class="picS" style="display:none;">内容六</div> <div class="picS" style="display:none;">内容七</div> <div class="picS" style="display:none;">内容八</div> <div class="picS" style="display:none;">内容九</div> <ul id=”controls”> <li class=’current’>slide控制一</li><li>slide控制2</li><li>slide控制3</li><li>slide控制4</li><li>slide控制5</li><li>slide控制6</li><li>slide控制7</li><li>slide控制8</li><li>slide控制9</li> </ul> </div> 主要jQuery代码及分析 $(function(){ [...]
从明天开始准备写一个系列性的文章,大致的内容就是看其它网站效果,并通过jQuery制作出来。最好的学习过程就是练习,多练习是提高能力的不二法定。记得上学时候英语老师为了提高我们的学习英语的兴趣,就给我看最新的美国大片,并且起了个名字叫“看大片学习英语”,我们都兴趣大增,原来逃英语课的同学都回来了。从实践中学习,从动手中学习知识是最有效的学习方法。 我将从各大网站中找效果,然后逐步分析,一步步用jQuery实现效果,希望这个系列可以让我们一起提高。如果你有特别好的效果想要实现可以留言或者EMail给我,咱们一起动手制作。
再写一个插件jQuery slide插件,左右点击滚动效果,图片循环播放. 效果如下图所示 主要代码 /* author:radys website: http://www.radys.cn date: 2009-6-2 16:06 plugins name: rady.ui.slide version v3.0 */ if(typeof rady === ‘undefined’) var rady = window.rady = {}; if(typeof rady.ui === ‘undefined’) rady.ui = {}; (function($) { rady.ui.slide = function(options) { this.opts = $.extend({}, rady.ui.slide.defaults, options); this._container = this.opts.itemContain; [...]
//反选 $.fn.checkNot = function(){ return this.each(function(){ if(typeof this.checked == ‘boolean’) this.checked = !this.checked; }) } //全选 $.fn.checkAll = function(){ return this.each(function(){ if(typeof this.checked != ‘undefined’) this.checked = true; }) } //全不选 $.fn.checkNone = function(){ return this.each(function(){ if(typeof this.checked == [...]
