效果图:编写JQUERY插件如下: 代码如下: ;(function($) { $.fn.extend({ "alterBgColor":function(options){ //设置默认值 option=$.extend({ odd:"odd", even:"even", selected:"selected" },options); //注意这个options 同上面的function(options)中的option是同一个对象 //隔行变色 $("tbody>tr:enev",this).addClass(option.even); $("tbody>tr:odd",this).addClass(option.odd); //单击行变色 $(tbody>tr,this).click(funct...
1.引入JS库,jquery.js脚本和插件脚本jcarousellite.js。 代码如下: 2.需要被展现的HTML结构 div>ul>li>img ,结构比较清晰 代码如下: 3.执行启动脚本 代码如下: $(function() { $(".default .jCarouselLite").jCarouselLite({ btnNext: ".default .next", btnPrev: ".default .prev" }); }); 官方网站演示:http://demo.jb51.net/js/jcarousellite2/index.htm打包演示下载:http://www.gxlcms.com/jiaoben/33787.h...
1. Flip HTML content in 3D用jquery实现的3D翻转效果,支持html内容的翻转。2. Agile Carousel3D效果的jQuery跑马灯特效。3. RotationjQuery旋转3D特效。4. Tag Cloud使用jQuery创建的3D标签云。5. Sphere一个jQuery实现的3D星球。6. Flip!7. Faux 3D Effect
1.$.messager.lays(width, height); 该方法主要用来定义弹出窗口的宽度和高度。 2.$.messager.anim(type,speed); 该方法主要定义窗口以什么样的方式和速度呈现。 $.messager.anim("fade",1000); //以fadeIn的动画方式显示 $.messager.anim("show",1000); //以show的动画方式显示 3.$.messager.show(title,text,time); 该方法主要定义窗口显示的内容,以及窗口显示多长时间后进行隐藏。 如果使用默认的标题,则将title设置为0,另外...
只好自己来写个文章,已便日后记忆! 先贴出插件代码,里面注释 代码如下: (function ($) { //扩展 $.fn.extend({ //插件名称 height: function (options) { //默认参数 var defaults = { color: 红色 }; //覆盖默认参数 var opts = $.extend(defaults, options); //主函数 return this.each(function () { //激活事件 var obj = $(this); obj.click(function () { alert(opts.color); }); }); } }) })(jQuery); //注后面的(jQuer...
此属性列表请对照jQuery EasyUI 1.0.5,关于它的更多资讯请猛击这里。 属性分为CSS片段和JS片段。 CSS类定义:1、div easyui-window 生成一个window窗口样式。 属性如下: 1)modal:是否生成模态窗口。true[是] false[否] 2)shadow:是否显示窗口阴影。true[显示] false[不显示]2、div easyui-panel 生成一个面板。 属性如下: 1)title:该标题文本显...
Embedded help system 看过该插件demo后,感叹道,真是太棒了! 点demo里的How to下面的几个链接看看效果:)Embedded Help System如其名,能将帮助信息集成到网页中,告诉用户一步一步怎么操作,易用性非常好!jRating 评分插件 jRating 是一个ajax评分插件,得益于插件的众多options和方法,它非常简单易用 !比如,你可以设置五角星的数量或者最大的得分等。 jNotify- jQuery Plugin使用jNotify你可以只需要一行代码就能显示提示...
应朋友的邀请,帮他公司做一个幻灯播放效果,效果如下: 缩略图正中间的为当前播放到的图片,两边呈发散状,逐渐缩小并降低透明度。假设当前正播放到第0张图片,则排列情况如下: 0 1 4 2 3 按逆时针方向转一张图后的排列情况如下: 4 0 3 1 2 这个只是缩略图的播放效果,缩略图轮转时,后面有对应大图跟着从右到左滚进,并且大图进入的速度要对应着缩略图轮...
英文链接:http://desizntech.info/2011/01/10-must-see-new-useful-jquery-plugins/ 1.Shadow Animation背景动画,支持淡入淡出效果,可惜ie不支持,火狐和谷歌浏览器能正常运行。 2.jQuery Quick TipjQuery快速提示插件。3.uGallery – Tiny and Clean Image Gallery 用户浏览图片的插件。 4.ezColumns 动态列插件 5.slideMosaic 有点像七巧板的感觉的插件 6.Modalpop 弹出窗提示插件 7.jQuery File Upload jQuery文件上传插件...
下面是html测试代码: 代码如下: autoComplete .autoComplete {margin:8px;position:relative;float:left;} .autoComplete input{width:200px;height:25px;line-height:25px;margin:0;padding:0;} .autoComplete ul{z-index:99;padding:0px;margin:0px;border:1px #333 solid;width:200px;background:white;display:none;position:absolute;left:0;top:28px;} .autoComplete li{list-style:none;} .autoComplete li a {displ...
目前实现如下功能: 1 最基本需求,根据当前文本框字符取出适配数据 1.1 支持同一页面多个元素调用本插件 1.2 必需的参数是url 1.3 对于连续不断地输入,会把之前的ajax请求全部取消,避免造成服务器无谓的压力(图4) 1.4 最基本调用$("myel").autoCmpt({url:"url"});2 空关键词查询开关(emptyRequest),打开则鼠标点在输入框内即出现提示(当下拉列表用),默认为true(图1)3 支持关联查询,即当前文本框的提示结果可依据页...
使用该jQuery插件 要想使用该jQuery插件,需要把$(selector).boxy();放在document.ready中。使用合适的选择器表达式替换这里的"selector",例如:"a[rel=boxy],form.with-confirmation"。这会给匹配的元素附加一些行为,如下: 一个href属性中如果锚点包含#,则此锚点相对应的ID的DOM元素的内容就会被添加到boxy对话框中。 如果href锚点内容为其他一些东西,则会试图使用Ajax载入其对应的内容。理想情况下,我们有相同的起源检查和...
Creative Radical Web Typography Lettering.js是一个轻量经的、易于使用的jQuery插件,可创造出极具个性的网页排版,是2010年最佳jQuery插件之一。 New FancyMoves Jquery Product Slider Jquery Product Slider是一款效果很不错的产品幻灯片插件。Jquery Space Gallery Jquery Space Gallery是一款很有空间感的图片库插件。Fancy Thumbnail Hover Effect 这是一款非常不错的Hover效果插件。Jquery Inline Form Validation 这是一...
一.摘要 本系列文章将带您进入jQuery的精彩世界, 其中有很多作者具体的使用经验和解决方案, 即使你会使用jQuery也能在阅读中发现些许秘籍. 本文是介绍两个最常用的jQuery插件. 分别用于表单验证和自动完成提示(类似google suggest). 二.前言 研究别人的作品真是一件花时间而且痛苦的过程. 当然也和本人英文不好有关. 总觉得控件作者写了很多文档但是都不够系统, 需要深入研究很多的实例后才能了解作者的思路.所以学习和研究一个插...
代码如下: (function($) { /** * 取得浏览器视图的宽度 */ $.viewWidth=function(){ var w = 0, D=document; if( D.documentElement && D.documentElement.clientWidth ) { w = D.documentElement.clientWidth; } else if( D.body && D.body.clientWidth ) { w = D.body.clientWidth; } return w ; } /** * 取得浏览器视图的高度 */ $.viewHeight=function(){ var h = 0, D=document; if(document.compatMode!=CSS1Compat){ h = D....