西林街 提供各种文档、视频资料、电子书和软件下载
jquery 插件整理(1000+种)
1.导航类
(1)Horizontal accordion: jQuery
基于 jQuery 开发,非常简单的水平方向折叠控件。
(2)jQuery-Hor
izontal Accordion
具有 XBOX360 blade 界面风格的水平方向 Accordion。
(3)jQuery plugin: Accordion
西林街 提供各种文档、视频资料、电子书和软件下载
用于创建 折叠菜单的 jQuery 插件。
(4)Accordion Menu script 基于 jQuery 开发的可折叠菜单。
(5)模仿 ext 的 tab 选项卡
TabPanel(选项卡组件) 参数说明 renderTo<渲染到某容器 string | jQuery object | NULL> 将选项卡组件渲染到某容器,参数类型可以为字符串,也可以为 jQuery 所加载的对象,如 果为声明该参数,组件默认的承载容器为 BODY。 items<选项卡元素集合 array> 选项卡组件渲染后就会显示的选项卡元素集合,具体参数请查看选项卡元素。
西林街 提供各种文档、视频资料、电子书和软件下载
width<宽度 string | number> 选项卡组件的总宽度,默认 400px。 height<高度 string | number> 选项卡组件中页面显示层的高度,默认 300px。 border<是否显示边框 string> 嵌套显示选项卡时,会出现重复边框的情况,影响美观,将 border 设置为”none”,则可 以避免,默认显示边框,不接受除”none”之外的参数值。 active<渲染后默认激活哪个选项卡元素 number> 下标以 0 为开始,默认为 0。 maxLength<最多显示几个选项卡元素 number> -1 为无限,默认为-1。 tabs<获得选项卡组件所有的选项卡元素 return array> 可根据需要获得选项卡组件的所有选项卡元素。 公共方法 addTab(添加一个选项卡元素 object) 动态向选项卡组件中添加一个选项卡元素。 flush(刷新选项卡元素的内容 string | number) 将选项卡元素的内容刷新,参数可以为选项卡元素的 ID 或下标。 show(显示选项卡元素 string | number) 显示制定选项卡元素,参数可以为选项卡元素的 ID 或下标。 Kill(关闭选项卡元素 string | number) 关闭选项卡元素,参数可以为选项卡元素的 ID 或下标。 getTabsCount()<获得选项卡元素数量 return number> getTitle(获得选项卡元素的标题 string | number) <return string> setTitle(设置选项卡元素的标题 string | number, string)
西林街 提供各种文档、视频资料、电子书和软件下载
getContent(获得选项卡元素的内容 string | number) <return string> setContent(设置选项卡元素的内容 string | number, string) getDisable(选项卡元素是否禁用 string | number) <return boolean> setDisable(设置选项卡元素是否禁用 string | number) getCloseable(选项卡元素是否可关闭 string | number) <return boolean> setCloseable(设置选项卡元素是否可关闭 string | number, boolean) getActiveTab()<获得被激活的选项卡元素 return object> 使用方法 页面引入 jQuery.js、TabPanel.js、Fader.js、TabPanel.css new TabPanel({ renderTo:'tabs', width: '100%', height: '500px', active: 0, items: [{ title:'工作中心', html:'<iframe width="100%" height="100%" frameborder="0"></iframe>', closable: false }] }); TabPanel item(选项卡元素) 参数说明 id<元素 IDstring> 必须唯一,或者不设置该参数,否则将无法添加到选项卡组件中,默认自动生成。
西林街 提供各种文档、视频资料、电子书和软件下载
title<元素标题 string> 可以动态设置。 closeable<是否可关闭 boolean> true 可关闭,false 不可关闭,默认为 true。
TabPanel.rar (22.94 kb) (6)
西林街 提供各种文档、视频资料、电子书和软件下载
(7)De-Constructing Accordion and Hover Effects with jQuery
(8)导航到页内指定位置 Automatically generate table of contents using jQuery (9) “Outside the Box” Navigation with jQuery This tutorial will cover a few ways to do just that with OS X style docks and stacks navigation.
(10) Sexy Drop Down Menu w/ jQuery & CSS
西林街 提供各种文档、视频资料、电子书和软件下载
In this tutorial you will learn how to create a sexy drop down menu that can also degrade gracefully.
(11) A Different Top Navigation 热点图书: In this tutorial you will use jQuery to create a different multi-layered horizontal navigation system that is still intuitive enough for anyone to use for the first time.
(12)Sliding Jquery Menu Tutorial
西林街 提供各种文档、视频资料、电子书和软件下载
(13)Animated Drop Down Menu with jQuery
14. jQuery UI Potato Menu
西林街 提供各种文档、视频资料、电子书和软件下载
15. Make a Mega Drop-Down Menu with jQuery
(16)Superfish v1.4.8 – jQuery menu plugin by Joel Birch
(17)jQuery (mb)Menu 2.7
西林街 提供各种文档、视频资料、电子书和软件下载
(18) jQuery File Tree
19.jQuery & CSS Example – Dropdown Menu
西林街 提供各种文档、视频资料、电子书和软件下载
20. Reinventing a Drop Down with CSS and jQuery
21. Simple jQuery Dropdowns
22. Styling Drop Down Boxes with jQuery
西林街 提供各种文档、视频资料、电子书和软件下载
23. jQuery iPod-style Drilldown Menu
24. jQuery Menu: Dropdown, iPod Drilldown, and Flyout styles with ARIA Support and ThemeRoller Ready
25. mcDropdown jQuery Plug-in v1.2.07
西林街 提供各种文档、视频资料、电子书和软件下载
26. jQuery Drop Line Tabs
27. Cut & Paste jQuery Mega Menu
西林街 提供各种文档、视频资料、电子书和软件下载
28. jdMenu Hierarchical Menu Plugin The jdMenu plugin for jQuery provides a clean, simple and elegant solution for creating hierarchical drop down menus for websites to web applications.
7. JQTreeTable JQTreeTable 这个 jQuery 插件能够将普通的 HTML 表格转换成带有嵌有 Tree 控件 的表格。 8. jQuery Simple Tree jQuery Simple Tree 是一个可拖放的树形控件。支持通过 Ajax 动态加载树节点,具 有简单易于使用和漂亮的外观等特点。 9. jQuery plugin: Treeview
这个插件能够把无序列表转换成可展开与收缩的 Tree。
西林街 提供各种文档、视频资料、电子书和软件下载
14. jQuery Menu jQuery Menu 是一个极好的菜单系统,可用于创建简单的下拉菜单,iPod-like 菜单和 Flyout 风格的导航菜。 15. NotesForMenu NotesForMenu 是一个非常简单的 jQuery 插件用于创建多层级树形菜单, 只需一行代 码就能够实现。 18. Advanced docking using jQuery 类似于 MS 的 VS 侧边可停靠工具栏。 注:不支持 IE6 20. Contactable
Contactable 这个 jQuery 插件可以帮助你在页面边框处创建一个可伸缩的反馈表单。
21.FastFind Menu Script
可拖动的嵌套菜单窗体,基于动态"AJAX"响应。
西林街 提供各种文档、视频资料、电子书和软件下载
22 jQuery UI Tabs jQuery UI Tabs:一个功能强大,易于使用的 Tab 控件。
23jstree jsTree 是一个基于 jQuery 的 Tree 控件。支持 XML,JSON,Html 三种数据源。提供创 建,重命名,移动,删除,拖"放节点操作。可以自己自定义创建,删除,嵌套,重命名, 选择节点的规则。在这些操作上可以添加多种监听事件。
24jQuery File Tree
西林街 提供各种文档、视频资料、电子书和软件下载
jQuery File Tree 是一个可配置的 Ajax 文件浏览器 jQuery 插件。可以通过 CSS 定制外 观, 指定文件树展开图标, 可以自己定义展开/收缩事件、 速度, 配置加载信息等。 jQuery File Tree 通过 Ajax 来获取文件信息。
25Superfish jQuery 菜单插件。支持水平/垂直方向。弹出子菜单不会被<SELECT>标签挡住。
26.accordion menu
西林街 提供各种文档、视频资料、电子书和软件下载
Accordion 风格的 jQuery 菜单。
27.CSS Dock Menu 采用 jQuery+CSS 实现,仿 Mac Dock Menu 的一个导航菜单。
28.CheckTree 带 Checkbox 的树型 jQuery 插件。
29.idTabs idTabs 是一个能够创建简单到复杂 Tab 控件的 jQuery 插件。支持动态添加和选择 Tab, idTabs 能够绑定到不同的事件如 mouseover。
西林街 提供各种文档、视频资料、电子书和软件下载
30. jQuery Context Menu jQuery Context Menu 是一个右键菜单插件。通过非常少的设置就能够轻松实现右键菜单 功能。
31. jQuery Right-click 这个插件能够让你使用 jQuery 来捕获由鼠标右键触发的事件。这些事件包括:click、 mouseup、mousedown。 32.jQuery Multi Level CSS Menu 这是一个多级水平 CSS 菜单,利用规则嵌套的 HTML 列表标签创建。当子菜单靠近窗体右 边缘时,将自动调整展示方面。
西林街 提供各种文档、视频资料、电子书和软件下载
33.ListNav ListNav 是一个用于创建按字母顺序分类导航的 jQuery 插件。
34.Simpletip Simpletip 是一个基于 jQuery 开发的 Tooltips 控件。Tooltips 可以附在任意元素(标签) 之上。并定制展示方式与位置。tooltips 可以是静态,动态或通过 Ajax 加载。
35. Smooth Navigation Menu Smooth Navigation Menu 是一个采用 jQuery 开发,基于 CSS 的多层级网站导航菜单。 菜单项的内容既可以直接从当前页面中获取,也可以从一个外面文件或通过 Ajax 获取。
西林街 提供各种文档、视频资料、电子书和软件下载
36. jdMenu jdMenu 是用于创建水平/垂直分层下拉菜单的 jQuery 插件.支持通过 Ajax 加载菜单项, 自定义动画效果,易于定制外观,支持相对(relative)与绝对(absolute) 定位等。
37.jqDock 这是一个能够将一组图片转换成类似于 Mac 风格鱼眼菜单(Dock Menu)的 jQuery 插件。 菜单可以是水平方向或垂直方向。
38 Animated Menu using jQuery A technique for animating menu items when a user hovers over them. Source files, including the PSD file, are available to download.
西林街 提供各种文档、视频资料、电子书和软件下载
39. Garagedoor Effect using jQuery Gaya Kessler presents a wonder JavaScript menu that mimics the real garage door using jQuery.
40.JGlide Menu A very unique menu that floats on the page. Users can drag it to a position they desire.
41. Vertical Sliding jQuery Menu HVDesigns presents a menu that drops down and reveals more links.
西林街 提供各种文档、视频资料、电子书和软件下载
42.LavaLamp When you hover an item, you’ll see the CSS sliding door technique created using jQuery. An alternate version for MooTols can be here.
43. Sliding JavaScript Menu Highlight This sliding hover effect script is an easy technique for highlighting menu items.
44. Fading Menu - Replacing Content This technique allows you to fade in and fade out menu items.
西林街 提供各种文档、视频资料、电子书和软件下载
45. Simple Multi-level Drop-Down Menu A simple JavaScript drop down menu tutorial.
46. Using jQuery for Background Image Animations A technique for creating animated menus using jQuery and CSS background-position properties.
47Tabpanel - jerichotab 1.效果图:
简介: jerichoTab 是一款模拟 firefox 标签页的插件, 通过丰富的 API 可以轻松的实 现动态添加, 删除, 激活 tab, 当 tab 页过多时会在左右两段增加滚动条... 导航: 详细介绍 | 在线演示 热点图书:
西林街 提供各种文档、视频资料、电子书和软件下载
48jDiv: jQuery 导航 Tab 一个可以显示丰富内容的下拉导航菜单(演示要翻墙)。
49. 基于 CSS3 和 jQuery 的半透明导航系统 鼠标在导航菜单上移动,显示半透明的指示图标。CSS3 做这个实在太容易了。
50 导航滑块
西林街 提供各种文档、视频资料、电子书和软件下载
这种风格的导航已经见于很多站点,鼠标在导航菜单上移动的时候,一个高亮指示条随着 鼠标滑动,指示当前的导航位置。
51. 流感导航菜单 下面的导航菜单,当鼠标在上面移动的时候,会很流畅地垂下解释菜单,当你将鼠标在上 面快速左右移动的时候,会怀疑这是 Flash。
2.消息提示类
(1)Facebox
Facebox 是一个基于 jQuery, Facebook-style 的 lightbox。 能够展示示 images, divs 或者整个远程页面。
西林街 提供各种文档、视频资料、电子书和软件下载
(2)SimpleModal SimpleModal 是一个轻量级 jQuery 插件提供了一个简单的接口来创建模式对话框。
(3)jTip jTip 一个利用 jQuery 开发的提示工具。 jTip 通过 HttpXMLRequest 获取内容。 用法简单, 只需要在你的元素的 class 上加上 Jtip,并引入 jtip.js 及其样式即可以。
(4)BetterTip
西林街 提供各种文档、视频资料、电子书和软件下载
一个可以自定义 Tooltip 的 jQuery 插件。基于 jTip,但比它来得更加灵活。
(5)clueTip
clueTip 这个 jQuery 插件方便您为链接或其它元素添加 Tooltip 功能。当链接包括 title 属性时,它的内容将变成 clueTip 的标题。clueTip 中显示的内容可以通过 Ajax 获取,也 可以从当前页面中的元素中获取。
(6)jQuery lightBox plugin
西林街 提供各种文档、视频资料、电子书和软件下载
一个简单,强大基于 jQuery 开发的 lightBox 控件。
(7)jQuery Impromptu 用于创建模式对话框,确认对话框,输入内容对话框的 jQuery 插件。
(8) jQuery.UI Messenger"Outlook like message notification Widget 这个 jQuery.UI 控件类似于 Messenger"Outlook 消息弹出提醒框。
(9)FancyBox 基于 jQuery 开发的 Lightbox 插件。支持对放大的图片添加阴影效果,对于一组相关的图 片添加导航操作按纽, Lightbox 除了能够展示图片之外, 该 还可以展示 iframed 内容, 通
西林街 提供各种文档、视频资料、电子书和软件下载
过 CSS 自定义外观。
(10)Coda Popup Bubbles 采用 jQuery 开发,类似“冒泡”效果的提醒弹出框。
(11)jGrowl jGrowl 用于制作消息弹出框的 jQuery 插件。 产生效果的类似于 Mac OSX 系统中 Growl 事件通知框架。
西林街 提供各种文档、视频资料、电子书和软件下载
(12)jqWindowsEngine 这个 jQuery 插件能够帮助你轻松创建 Ajax Windows。
(13)jQuery Alert Dialogs 这个 jQuery 插件能够替换 JavaScript 提供的 alert()、confirm()和 prompt()功能。支 持利用 CSS 自定义对话框外观。
西林街 提供各种文档、视频资料、电子书和软件下载
(14)BeautyTips BeautyTips 是一个 jQuery Tooltip 插件.
(15)Facebook/Xiaonei 风格模态框
西林街 提供各种文档、视频资料、电子书和软件下载
效果图:
简介: 使用 div, table 和 opacity 效果实现模态框效果... 导航: (15)jmpopups 可弹出多级新窗口 (16) LeaveNotice LeaveNotice 这个 jQuery 插件能够很方便提醒你的用户,他们正在离开你的网站。 (17)JQuery Float Dialog
JQuery Float Dialog 是一个浮动模式对话框,可通过参数控制对话框弹出速度、全屏背景、 弹出回调事件、弹出的方向等。 (18)weebox
weebox 是一个基于 jquery 的弹窗插件。它含有以下特性:
.支持多层弹窗
.支持单一弹窗,即同 ID 弹窗在打开第二次使用时,前一个将被自动关闭,参考 boxid 选项
西林街 提供各种文档、视频资料、电子书和软件下载
.支持自定义样式,参考 boxclass 选项
.解决 IE 中 SELECT 的问题,使用了 bgiframe 功能
.支持拖动效果,通过 draggable 设置,参考 draggable 选项
.支持内容来源方式 Ajax, Selector(jQuery 的), Text(直接内容)
.支持多种弹窗类型,参考 type 选项
.支持自动关闭,参考 timeout 选项
.支持遮照效果(modal 弹窗),参考 modal 选项
.支持不同的显示位置,中间或者以某个元素为参照物,参考 position 选项
.支持弹窗打开前(onopen)、点确认(onok)、点取消(oncancel)、关闭窗口(onclose)等的回调函 数
.支持打开后,重新设置标题(setTitle)、内容(setContent)、按钮等方法
.支持只在弹窗内查找元素的方法:find(selector)
.支持打开和关闭时的动画效果,参考 animate、showAnimate,hideAnimate 选项
19.DHTML window with tab support 带有 Tab 支持的 DHTML Window 控件。它使用 cookies 来 (20)qTip (21)Simple tooltip (22)Side Navigation Tooltip 利用 jQuery 为侧面导航菜单添加 Tooltips 气泡提示说明。 (23)jquery-rollover-tooltip
西林街 提供各种文档、视频资料、电子书和软件下载
利用 jQuery 实现当鼠标移过图标上方时会出现一个气泡(tooltip),气泡中的内容读取 自 html tags 属性。 1. Dynamic tooltip Very cool tooltip! It’s very well made because it consists of cool transition effects and it also has a transparency and a drop shadow effect.
2. Popup Bubble Brilliant tooltip! It looks so simple but it has awesome transition effects. This tooltip could be very useful for clean and simple websites.
3. jQuery Horizontal Tooltips Menu Tutorials Beautifully made tooltip! This tooltip never disappears but follows when you hover over other links. Such a simple looking tooltip but its animation is brilliant.
西林街 提供各种文档、视频资料、电子书和软件下载
4. Prototip A lot of various very good looking tooltips which look awesome and have beautiful effects. Brilliant peace of work!
6. Awesomeness Cool tooltip with nice transition effect and cool transparent border around it.
西林街 提供各种文档、视频资料、电子书和软件下载
7. TipTip Beautifully made tooltip with fade in / out transition effects, transparency and drop shadow effect.
8. (mb)Tooltip Beautifully made tooltip with nice transition for input fields.
9. vTip
西林街 提供各种文档、视频资料、电子书和软件下载
Simple but well made tooltip with a fade in transition effect. It has a cool looking border around it and when this tooltip appears, it also follows your mouse.
10. jGrowl Cool tooltip which appears when you click on the link and then it sticks on the right-top corner of your window, and disappears after some time or when you close it manually by clicking on the close button. It also has fade in / out transition effects.
西林街 提供各种文档、视频资料、电子书和软件下载
11. jQuery Ajax Tooltip Interesting tooltip which can handle image and text together like a mini page. It has a drop shadow effect.
12. Digg-style post sharing tool with jQuery Cool digg-style post sharing tool. This tooltip could be very useful for social networking website.
西林街 提供各种文档、视频资料、电子书和软件下载
13. Input Floating Hint Box Interesting tooltip with rounded corners for input fields. Tooltip fades in when you click on the input field and fades out when you click somewhere else.
14. Simpletip Beautifully made tooltip with fade transitions. When you hover over a link, a tooltip fades in just above or below the link.
西林街 提供各种文档、视频资料、电子书和软件下载
15. qTip Very simple but good looking tooltip. This tooltip is available with rounded corners and also as a speech bubble tip.
16. Orbital Tooltip Interesting tooltip plugin where you can set manually where your tooltip will show up.
西林街 提供各种文档、视频资料、电子书和软件下载
17. Inline HTML Tooltip Cool tooltip with nice transition effects.
18. tipsy Interesting good looking tooltip which appears above, below, on the right or left side of the link.
19. Easiest jQuery Tooltip Ever Simple tooltip but it could be useful to display an image when you hover over a link.
西林街 提供各种文档、视频资料、电子书和软件下载
20. BsTip Various simple tooltips with fade in and fade out transition effects and border around them.
21. EZPZ Tooltip Very simple tooltip with border around it, which follows your mouse.
西林街 提供各种文档、视频资料、电子书和软件下载
22. BeautyTips Nice balloon style tooltip with transparency effect. There are available various tooltip styles, even interesting tooltips with cool animation, so you can choose one that fits best for your needs.
23. Tooltip Various tooltip plugins for your website. Here you can find a simple tooltip with a nice fade transition and also you can find a good looking bubble style tooltip.
25. Creating A Simple Tooltip Using jQuery and CSS Few simple but different tooltips.
西林街 提供各种文档、视频资料、电子书和软件下载
26. BetterTip Tooltip which appears on the right side of the link.
28. jqTooltip Simple tooltip with ajax loaded content. It has fade in and fade out transition effects.
29. Pop! Simple tooltip which shows up when you click on the arrow button and disappears when you click somewhere else.
西林街 提供各种文档、视频资料、电子书和软件下载
30. Create a Simple CSS + Javascript Tooltip with jQuery Simple tooltip with rounded corners. It follows your mouse movements.
西林街 提供各种文档、视频资料、电子书和软件下载
3.图片文字展示类
(1)imgAreaSelect imgAreaSelect 这个 jQuery 插件能够选取一张图片中一个矩形区域。
(2)Easy Slide EasySlide 是以 jQuery 为基础开发的一个图库展示插件,EasySlide 可以将任何一个网 页容器(Container)内的图形自动将其排列展示,并加上鼠标指向时的暂停效果(Pause), 可以当作图库展示或是动画及广告 Banner 使用。
(3)Easy News
西林街 提供各种文档、视频资料、电子书和软件下载
Easy News 是一个可以让您轻松显示网站新闻或图文内容展示的 jQuery 插件,可设定 Fade In-Out ,Slide Up-Down, Left To Right 的效果,调整显示速度,可自行修改 CSS 改变您为喜欢的风格。
Easy News Plus Easy News Plus 是基于 Easy News 开发,滚动式新闻或图文内容展示的 jQuery 插件, 但是与 Easy News 有完全不同的显示方式(以左右滑动为主要的显示方法)。 (4)jQZoom 基于 jQuery 开发的图片放大镜插件。
jQuery Plugin: Text Highlight
西林街 提供各种文档、视频资料、电子书和软件下载
利用 javascript 对页面中的关键字进行着色的 jQuery 插件。
(5)jCarousel Lite 这个 jQuery 插件能够帮助你以滚动(carousel)的方式来组织图片和其它内容。
(6)jCarousel jCarousel 是一个 jQuery 插件用于控制一个列表项目的水平或垂直顺序, 列表项目的内容 可以是静态 HTML 内容或通过 AJAX 加载的内容。可以向前或向后滚动。
(7)Spacegallery-Jquery 一个采用 jQuery 开发,类似于 Flash 效果的图库(image gallery)。
西林街 提供各种文档、视频资料、电子书和软件下载
(8)jQuery Slider Gallery 这是一个基于 jQuery 开发相册控件,类似于 Apple 网站上用于展示产品的效果。
(9)jQuery Cycle Plugin jQuery Cycle Plugin 是一个 slideshow 插件。 支持多种变换效果: shuffle、 zoom、 fade、 turnDown、curtainX、scrollRight。
(10)Zoomimage 该 jQuery 插件能够让以当前流行的方式来展示图片。提供:预加载图片提示,对图片进行 分组,自动调整图片显示比例,图片分组浏览控制。
西林街 提供各种文档、视频资料、电子书和软件下载
(11)prettyPhoto prettyPhoto 是 jQuery lightbox 的一个“克隆”。并增加动画效果,图库浏览等特性。
(12)ThickBox
西林街 提供各种文档、视频资料、电子书和软件下载
ThickBox 是一个模式对话框 UI 控件。基于 jQuery 开发,可以用来展示单张或多张图片, 内嵌的内容,iframed 的内容,或通过 Ajax 获取的内容。
(13)Galleria Galleria 是一个采用 jQuery 开发的图片展示插件。它通过缩略图导航一张一张的显示大 的图片。支持通过 CSS 设置整个相册的风格。能够按比例创建缩略图并剪切成适合在缩略 图容器中显示的小图片。能够触一些事件,因此可以在图片加载时执行一些动作。
西林街 提供各种文档、视频资料、电子书和软件下载
(14)jQuery Flash Plugin 一个 jQuery 插件用于在页面中嵌入 Flash 影片。
(15)jQuery.SerialScroll jQuery.SerialScroll 是一个用于创建滚动效果的 jQuery 插件,支持水平/垂直方向滚动 和混合滚动效果。
西林街 提供各种文档、视频资料、电子书和软件下载
(16)InnerFade InnerFade 这个 jQuery 插件能够让任意一组元素 (img, 等) div 实现淡入淡出播放效果。
(17)NyroModal 一个基于 jQuery 开发,非常灵活和可定制外观/动画效果的模式对话框。可通过 Ajax 调 用目标内容,改变对话框大小等。
西林街 提供各种文档、视频资料、电子书和软件下载
(18)CrossSlide CrossSlide 这个 jQuery 插件实现了一些常用 Javascript 幻灯片放映动画效果如: 动态地 移动、缩放、渐变、滑入"滑出等。
(19)Magnify
西林街 提供各种文档、视频资料、电子书和软件下载
Magnify 是一个能够在图片上添加放大镜功能的 jQuery 插件。
(20)Img Notes 用于当鼠标移到图片是时,显示一个信息提示框。
(21)FancyZoom FancyZoom 采用缩放效果来展示图片或任意 HTML 页面,不需要另外开启页面来载入图 片,其效果在 Apple Mac 的官方网站中也有。
西林街 提供各种文档、视频资料、电子书和软件下载
(22)Jcrop Jcrop 是一个跨浏览器的 jQuery 图片剪切插件(jQuery image crop plugin)。支 持对剪切框加 CSS 样式,当选取或拖动时添加回调事件(Callbacks),剪切时能够约束 宽度与高度。
(23)Galleriffic Galleriffic 是一个用于创建快速展示相册中照片的 jQuery 插件。 图片既可以以幻灯片的方 式查看,也可以手动点击缩略图查看。Galleriffic 还支持分页,从而使得它能够展示更多的 图片。
西林街 提供各种文档、视频资料、电子书和软件下载
(24)Image Upload and Auto Crop 采用 PHP+jQuery 开发的图片上传和剪切(Crop)工具。
(25)prettyGallery prettyGallery 是一个图库导航控件 Slider。基于 jQuery 开发,除了可以导航图片之外, 还支持其它任何内容。可以配置导航滚动速度和图片标题说明。
(26)jQuery.popeye
西林街 提供各种文档、视频资料、电子书和软件下载
jQuery.popeye 这个插件能够将一组无序的图片列表转换成一个简单的相册。 当点击图片 时将以 Lightbox 风格放大图片。图片展示框提供向前/向后控制并能够为每一张图片添加 备注说明信息。jQuery.popeye 能够根据图片大小自动调整展示框的高度和宽度。
(27)s3Slider s3Slider 是一个 jQuery slideshow 插件,效果类似于 smooth slideshow。 可以在图片上的任意位置,透明显示当前所放映图片的说明信息。
西林街 提供各种文档、视频资料、电子书和软件下载
(28)Pirobox 采用 jQuery 开发的 Lightbox 控件。能够根据浏览器窗体大小自动调整展示图片大小。提 供向前/向后控制链接。动态加载图片效果。易于定制。
(29)Simple Controls Gallery 这是一个采用 jQuery 开发的图片 slideshow 控件。提供一个暂停/播放/向前/向后展示的 控制菜单。这个 jQuery slideshow 可以设置当页面打开时自动播放图片并能够将最近查 看的图片存储在 cookie 中。
西林街 提供各种文档、视频资料、电子书和软件下载
(30)Agile Carousel Jquery Slideshow 插件。易于定制图片切换效果。提供开/关图片标题显示,添加文本水 印等功能。
(31)jQuery Plugin-Page Peel
西林街 提供各种文档、视频资料、电子书和软件下载
这是一个用于创建 Page Peel(卷页/页面剥落)特效的 jQuery 插件。
(32)Easy Slider 一个 jQuery 插件,当点击导航按纽时可以水平或垂直播放图片或其它任何内容。
(33)imgPreview 图片预览 jQuery 插件。 当鼠标移到图片链接上时, 会在链接的旁边出现一个类似于 tooltip 效果的图片展示框。
西林街 提供各种文档、视频资料、电子书和软件下载
(34)Jquery Fade In.Fade Out 这是一个用于让图片产生淡入淡出效果的 jQuery 插件。
(35)Captify 这个 jQuery 插件能够在图片上显示标题信息,当鼠标放到图片上时滑动出现。
(36)jParallax
西林街 提供各种文档、视频资料、电子书和软件下载
这是一个用于生成视差现象的 jQuery 插件。 mParallax 能够产生的效果与 jParallax 一样 但采用 Mootools 框架开发。
(37)jQuery---运用图片预加载技术打造幻灯片 截图:
西林街 提供各种文档、视频资料、电子书和软件下载
http://www.cssrain.cn/demo/jQueryImgLoad/Demo2/demo3.html http://www.cssrain.cn/demo/jQueryImgLoad/Demo1/demo1.html (以前做的, 非预加载) 下载: (38)jQuery pageSlide
jQuery pageSlide 是一个 jQuery 插件,它可以控制一个隐藏页面的显示和关闭。具体来 说,就是当前页占一个完整页面,隐藏页是看不到的,你设置一个控制的地方,点击该控制 时触发事件,隐藏的页面就弹出来。再次点击隐藏页面以外的空间,它就又关闭。 这适合在有限的空间里,在主页里放重要内容,而隐藏页放一些并不一定要显示,而是有需 要的用户才去展开显示的内容。
西林街 提供各种文档、视频资料、电子书和软件下载
(39)Creating a Slick Auto-Playing Featured Content Slider
Niall Doherty 的 Coda Slider 为许许多多的设计师带来了灵感. Chris Coyier 创建的这 个 Slick Auto-Playing Featured Content Slider 使用 Coda Slider 插件 ,实现我们 常说的”图片焦点特效”。多用于门户站。 (40)Portfolio Layout Idea Using jQuery
非常漂亮的一个特效布局。由 Benjamin Sterling 创建的这个 portfolio layout 使用了 jQuery 的 easing plugin. 适合那些想用来展示个人作品集的用户。
西林街 提供各种文档、视频资料、电子书和软件下载
它在页面两边显示带缩略的作品列表, 当你点击每个条目时, 会在中间部分以退场然后进场 的特效呈现出该作品的全部内容。 (41)jQuery---图片先模糊后清楚 很多图片网站用了这种技术,Google 图片中心也不例外。 这种技术的图片是先显示模糊的,然后再显示清楚的。 这个模糊的原理就是 一张小图片,然后把尺寸放大,大小等于大图片的宽度和高度。 小图片被拉大了,理所当然就模糊了。 试想:小图片的尺寸是 10kb,大图片的大小是 500kb,那么加载小图片的速度就是大图片 的 50 倍。 当然你会说,如果直接显示大图片是什么情况呢?答案是:一片空白等着你。 演示: (42)使用 jQuery 实现网页报纸 演示: 原理:使用报纸内容作为 背景图,相对定位。 然后里面的 div 设置为绝对定位,大小,left 和 top 都要跟背景图匹配。 所以这个有一定的规律。 下载:
西林街 提供各种文档、视频资料、电子书和软件下载
引申: 当后台人员问,每次要传坐标,宽度和高度不麻烦么?用户知道使用么? 教用户使用 photoshop?。。。!!! 解决方案: 使用图片截图的插件即可,一般的截图插件都能获取 4 个坐标,宽度和高度, 当然我们只需要这些,并不需要把图片真正截取下来。 (43)jQuery 购物网站产品展示. 作者:cssrain@gmail.com(admin)
西林街 提供各种文档、视频资料、电子书和软件下载
程序介绍: 1,点击大图可以弹出遮罩效果. 2,下方小图可以左右滚动. 3,点击新窗口打开,可以打开当前的大图片. 4,遮罩层中小图也可以左右滚动,也可以打开大图片.
在 IE6,IE7,Firefox3 & google 浏览器下测试通过.
西林街 提供各种文档、视频资料、电子书和软件下载
演示:
下载:
(44)Gallerific
Galleriffic 是使用 Mike Alsup 的 jQuery Cycle plugin 创建的图片展示效果,包括缩 略图、图片标题和描述等详细功能,是一个非常不错的高质量画廊相册展示工具。
(45)ZoomImage
西林街 提供各种文档、视频资料、电子书和软件下载
zoomimage ,以一种独具魅力的方式展示图片效果。缩略图链接在本页弹出大图,并且 可以可以随意拖拽该悬浮图片。
(46)EasySlider
西林街 提供各种文档、视频资料、电子书和软件下载
Easy Slider 可以实现图片或其他任意内容,在水平或垂直方向上的滑动效果,你还可以 通过 CSS 自定义设置样式。
(47)The Slider from Barack Obama’s website
一个源自美国总统 Barack Obama 网站的垂下滑动菜单控制的图片幻灯效果。
(48)CodaSlider
CodaSlider,又一个不错的滑动控制效果。
(49)jQuery Slider II
西林街 提供各种文档、视频资料、电子书和软件下载
jQuery Slider II 的布局非常符合操作习惯,在底部列出带滚动条的缩略图控制列表,然 后在上面显示对应图片的大图浏览,非常适合做高级相册。
(50)Beautiful Slider 热点图书:
Beautiful Slider, 光看这个效果图你就知道这个插件有多棒了吧,是的,这个插件实现 的效果已经不逊色于 Flash 完成的效果,整体表现流畅,文字显示效果更是创意独特。
(51)LoopedSlider
西林街 提供各种文档、视频资料、电子书和软件下载
loopedSlider 是又一个任意内容滚动切换的幻灯片插件,使用操作简单。
(52)SpaceGallery
西林街 提供各种文档、视频资料、电子书和软件下载
SpaceGallery 是一个全新的 jQuery 插件,点击当前图片,会自动放大消失,同时后面的 图片向前展示,有一种时光机器的感觉。
(53)jQuery Popeye
西林街 提供各种文档、视频资料、电子书和软件下载
(54)Noobslide
(55)Accessible News Slider
(56)SmoothGallery
西林街 提供各种文档、视频资料、电子书和软件下载
SmoothGallery 是一个最好的 Javascript 幻灯片效果之一,可以实现各种不同的幻灯片 转换效果。
(57)jQuery Multimedia Portfolio
jQuery Multimedia Portfolio 是一个基于 jQuery 的滑动效果插件,除了可以展示图片之 外,还可以加入各种不同类型的多媒体文件。
(58)s3Slider
西林街 提供各种文档、视频资料、电子书和软件下载
s3Slider 是一个非常简单实用的流畅幻灯片效果,这个插件被应用在无数的 WordPress 专业主题模板中。 via: 15 jQuery image carousels for slideshows and galleries
(59)fxMarquee
fxMarquee 是一个 jQuery 内容滚动插件。它可以让一组内容定向滚动,并可以设置滚动 速度。本插件具有以下特点:
? 可以上、下、左、右四个方向滚动。可设置鼠标移上时停止滚动。 ? 支持自定义的加速按钮。
1.介绍 2.演示 3.参数说明 4.教程 5.下载 6.兼容性 7.反馈
(60)商品放大镜效果
西林街 提供各种文档、视频资料、电子书和软件下载
在一些大型的购物网站 你经常可以看到这个效果,通过放大镜效果,可以把一个小的图片 的某一部位放大到清晰可见。
1.原理
首先你必须要有 2 张图片,一张缩略图和一张高清晰的图片。 然后当鼠标在缩略图里移动时,通过计算鼠标在缩略图里的位置和比例。 最后通过比例就可以得出大图要显示的部分。 所以最简洁的 HTML 代码结构如下:
2.小图中的半透明层热点图书:
当鼠标滑入小图片时,我们需要添加一个半透明层用来显示当前鼠标框住的区域。 有 3 种状态: (1)鼠标滑入 (2)鼠标滑动 (3)鼠标滑出 滑入时,我们需要给半透明层定位,并马上显示出层。通过给元素绑定 mousemove 事件。 滑动时,需要给透明层实时定位,在计算定位时,要注意半透明层不超出图片边界。 同时在 mousemove 时,添加了一个 setTimeout,减少资源占用。 滑出后,隐藏半透明层,并把 mousemove 解除绑定,减少资源占用.
西林街 提供各种文档、视频资料、电子书和软件下载
这一步最关键的就是,滑动时中心点和坐标的计算。 演示:
3.显示放大的图热点图书:
第 2 步完成后,第 3 步就相对简单了。 在刚才 3 种状态上,在添加点内容。 鼠标滑入时,需要添加大图的显示。 鼠标滑动时,需要根据鼠标当前的位置在小图中的比例,然后把比例*大图的宽度高度 得 到大图显示的位置。 鼠标滑出后,需要隐藏大图。 这一步最关键的就是,滑动时比例的计算。 演示:
4.发散思维热点图书:
此效果不仅是显示商品,地图鹰眼效果也可以使用.
下载:
(61)PageSlide
西林街 提供各种文档、视频资料、电子书和软件下载
使用时,在当前页面中设定一个链接,该链接的 href 属性指向另一个页面 A,并为该链接 绑定 pageSlide 事件。 点击链接时, 触发 PageSlide 事件, 在页面中创建一个新的区域 (左 侧或右侧,依据传入参数而定),然后通过 jQuery ajax 将页面 A 中内容读取到该区域中。
PageSlide 用法很简单,简单说一下: 1.引用 jquery 库文件及 pageslide 插件文件 2.在页面中添加事件触发链接,链接地址是要打开页面的地址,如:
<a href="_left.html" id="slide-left">从右边打开隐藏空间</a>
3.为链接绑定 pageSlide 事件,并传入设定参数:
4. 5. //第一个参数是页面新区域的宽度 //第二个参数是当前页面移动方向,方向为 left,也就是从右侧出现新区域 $("#slide-left").pageSlide({ width: "350px", direction: "left" });
下载 PageSlide 插件: 点击下载 本地下载:pagelider.rar (3.68 kb)
62.
西林街 提供各种文档、视频资料、电子书和软件下载
63.
64.不错的图片分类展示或者文字展示效果 热点图书:
西林街 提供各种文档、视频资料、电子书和软件下载
(65)jQuery Infinite Carousel
66.T 血展示效果
How to Make a Threadless Style T-Shirt Gallery
西林街 提供各种文档、视频资料、电子书和软件下载
67.利用 z-index 做的图片展示效果 Create a gallery by using z-index and jQuery
68.Page Peel Effect(卷页效果)jQuery 和 CSS
Soh Tanaka 在他网上发布了一个 “简单的卷页效果(Simple Page Peel Effect with jQuery & CSS.)” ,像这样的卷页效果或翻页效果,在一些门户网站或者是个人博客上 经常能看得到
西林街 提供各种文档、视频资料、电子书和软件下载
它实现的思路是有一个 “peel” 图片放在元素的右上方 ,当你徘徊在“Peel”时, “peels ”就 会打开 和 “peels” 就会关闭, 卷页里可以放置广告或者是订阅信息。 这个很炫的效果看起 来要通过 flash 来实现,不过,使用 jQuery 或 MooTools 技术就可以轻松实现。
69。Page Peel 可以设置广告的高度、宽度、背景图和定位坐标等。和 Pageear 一样,使 用 Flash 来显示果皮剥开的特效。 70.Create a 3D Tag Cloud in jQuery (演示地址) 一个用于创建会滚动的 3D 标签云 jQuery 插件。 71.Sliding Login Panel with jQuery 别的不说,先看效果图吧 这是展开以后的效果图 这是收缩以后的效果图 用 jQuery 实现这个功能也就几个函数就搞定了,来看看关键的代码吧。
西林街 提供各种文档、视频资料、电子书和软件下载
1<script type="text/javascript" src="js/pngfix/supersleight-min.js"></script> 2<script type="text/javascript" src="js/jquery-1.3.2.min.js"></script> 3<script type="text/javascript" src="js/slide.js"></script> 首先要导入 3 个 js 文件,其中 js/jquery-1.3.2.min.js 是压缩以后的 jQuery 类库; js/pngfix/supersleight-min.js 是支持 IE6 的一个类库, 是对图片进行处理的, 它能消除 那两个按钮图片的四周 (图片本来是长方形的,这里你看到的是圆角图片)。 然后就是下面的两个链接按钮了<a id="open">Log Id | Register</a> 和<a id="close">Close Panel</a> 1<div class="tab"> 2 3 4 5 6 7 8 <ul class="login"> <li class="left"> </li> <li>Hello Guest!</li> <li class="sep">|</li> <li id="toggle"> <a id="open" class="open" href="#">Log In | Register</a> <a id="close" style="display: none;" class="close"
href="#">Close Panel</a> 9 10 11 12 </li> <li class="right"> </li> </ul> </div>
第三个 js 文件里面写的就是 jQuery 的函数,代码很简单:
西林街 提供各种文档、视频资料、电子书和软件下载
1$(document).ready(function() { 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17}); // Switch buttons from "Log In | Register" to "Close Panel" on click $("#toggle a").click(function () { $("#toggle a").toggle();//这个就是具有 slideUp()和 slideDown()双重效果 }); // Collapse Panel $("#close").click(function(){ $("div#panel").slideUp("slow"); }); //点击 id 为的 close 链接隐藏面板 // Expand Panel $("#open").click(function(){ $("div#panel").slideDown("slow");//点击 id 为 open 的链接展开面板 });
下载: jquerylogin.rar (58.83 kb) 72.jquery 隐藏登录效果 当你不需要把登陆框直接显示在首页又必须要有这个玩意儿的时候,一个漂亮的下拉动画登 陆框能够帮你达到你想要的效果.
西林街 提供各种文档、视频资料、电子书和软件下载
当你的用户想要登陆的时候,点击按钮,弹出填写账户密码,不需要时则隐藏,多么好的用户体 验.. [预览效果] [下载源码] [制作过程] 73.inFrame: Keep Demos Inside the Page with jQuery 利用 jQuery 在同一个页面中演示多个 Demo,实现不需要离开当前页面就能查看单独的 Demo 链接, 不需要在 head 标签中添加 Demo 所需要的 CSS 文件, 也不用担心 javascript 会与其它 javascript 相冲突。 简单易用, 只要指定每一个 Demo 链接的 Class 为 inframe 就可以。 (74)jQuery Superbox! jQuery Superbox!是一个 jQuery 插件用于创建可定制的模式对话框(效果与 lightbox 相似) 它可以展示任意类型的内容包括 iframes, 。 默认为图片类型 (支持单张或多张模式) 。 模式对话框的尺寸可以根据展示的内容自动调整,也可以定义一个标准展示尺寸。
(75)NyroModal 一个基于 jQuery 开发,非常灵活和可定制外观/动画效果的模式对话框。可通过 Ajax 调 用目标内容,改变对话框大小等。
转花灯 Roundabout 是一个 jQuery 插件,可以将一组 HTML 对象转换为旋转花灯的效果。
西林街 提供各种文档、视频资料、电子书和软件下载
75. 拉洋片 拉洋片也许是 jQuery 最拿手的效果了。该效果在遇到 JavaScript 被禁用的场合会自动 降级使用。
76. jQuery Quicksand 插件 这个让人赞叹的插件,可以对一组 HTML 对象重新洗牌,效果非常出众。
西林街 提供各种文档、视频资料、电子书和软件下载
77.文字的移动纹理
在文字上,显示移动的纹理,效果美轮美奂。原理是,做一个带透明文字的 PNG 图像放 在一个容器里,容器的背景放一张图案,用 jQuery 移动容器的背景,很简单,不过,不 支持 IE6,因为 IE6 不支持 PNG。
西林街 提供各种文档、视频资料、电子书和软件下载
77 云台式拉洋片 常规的拉洋片效果要么左到右,要么右到左,或者垂直上下,这个 jQuery 效果可以象云 台那样扫镜头。
10. SlideDeck
西林街 提供各种文档、视频资料、电子书和软件下载
SlideDeck 是一种新颖的内容展示方式,有点类似 Outlook 的手风琴菜单,但视觉效 果和用户体验更好一些。
4.自动填充类
(1)AutoComplete-JQuery jQuery 插件易于集成到现在的表单中(Form)。
二手图书 二手书 特价书 旧书网
(2)Facebook like Autocomplete
西林街 提供各种文档、视频资料、电子书和软件下载
基于 jQuery 开发,类似于 FaceBoox 提供的 AutoCompleter。 二手图书 二手书 特价书 旧书网
(3)jQuery Autocomplete Mod
热点图书:
jQuery Autcomplete 插件。能够限制下拉菜单显示的结果数。
(4)jqac
热点图书:
基于 Jquery 开发的 Autocomplete 插件。具有易于使用,配置简单,既可以利用 Ajax 读 取数据也可以直接从本地获取数据。
(5)jQuery Tag Suggestion
西林街 提供各种文档、视频资料、电子书和软件下载
类似于 del.icio.us 提供的 tag suggesting 功能。
(6)Autocomplete-jQuery ajax
利用 jQuery(Ajax),PHP 和 MySQL 开发的 AutoCompleter。
(7)jQuery.Suggest
热点图书:
跨浏览器支持,基于 jQuery 开发的 Autocomplete library。
(8)Autocomplete- jQuery plugin
一个 jQuery Autocompleter,提供缓存选项来限制对服务器的请求。
(9)jQuery plugin: Autocomplete
西林街 提供各种文档、视频资料、电子书和软件下载
自动完成输入框值让用户能够快速查找和过滤某些值。
(10)jSuggest
模仿 Google Suggest 功能的 AutoComplete jQuery 插件。
(11)jQuery Live Ajax Search Plug-in
热点图书:
西林街 提供各种文档、视频资料、电子书和软件下载
采用 jQuery 开发的 AutoComplete 控件。 搜索结果展示框完全可以利用 CSS 自定义, 内 容展示是一个 HTML 页面。
(12)ddcombobox
带 AutoComplete 功能的下拉选择框 jQuery 插件。
(13)Kissy Suggest
西林街 提供各种文档、视频资料、电子书和软件下载
重写后的组件压缩后约 10k, 仅依赖 YUI2 的 yahoo-dom-event. 目前在淘宝已全面 应用一个多月。现在开源出来,希望能对需要此功能的兄弟们有所帮助。源码地址: suggest-yui2.js 是源码,test.html 是测试页面,demo.html 是实例, demo-google.html 是利用该组件给谷歌恢复搜索提示的小玩意。如果在项目中真实使 用,需要加载以下两个文件:
http://kissy.googlecode.com/svn/trunk/build/suggest/suggest-yui2-min.js
可以很自信地说:这个组件目前无论在细节还是性能上,都是数一数二的。 欢迎试用和有效的建议。 PS:很感慨 Google 的产品,精致小巧,非常注意细节。Google 英文首页的搜索提示, 看似简单,但极不简单。对键盘和鼠标等事件的细节处理上,没有看到比 Google 做得更 好的。Kissy Suggest 在交互细节上基本上做到了和 Google 的一样,同时增加了对本土 输入法的支持 (14)apple 风格的自动填充效果
西林街 提供各种文档、视频资料、电子书和软件下载
5.分页类
(1)jQuery Pagination
jQuery 分页插件
jQuery Pagination (2)pager jQuery plug-in
西林街 提供各种文档、视频资料、电子书和软件下载
jQuery 分页插件。
(3)JQuery Pager 一个利用 jQuery 开发的分页 UI 控件,可用于数据驱动的 web 应用程序中。
6.编辑器类
(1)jwysiwyg
WYSIWYG jQuery 插件。整个编辑器文件大小只有 17Kb。
(2)Damn Small Rich Text Editor
西林街 提供各种文档、视频资料、电子书和软件下载
基于 jQuery 开发, 能够从 IFRAME 元素创建一个 Rich Text Editor。 提供了所有基本的 Rich Text 功能,可设置文本编辑区大小,Ajax 上传图片等。
(3)xhEditor
xhEditor 是一个基于 jQuery 开发的简单迷你并且高效的可视化 XHTML 编辑器,基于网络访问并且兼容 IE 6.0-8.0,Firefox 3.0,Opera 9.6,Chrome 1.0,Safari 3.22。 编辑器组件采用 LGPL 协议开放源代码,您可以任意修改,并使用在您商业或者非商业系统中。同样,您 也可以任意的学习和参考我们的源代码。若您对本编辑器代码进行改动或者再开发并对外发布的话,请您 也使用 LGPL 协议来开放您的源代码,谢谢。 最新 0.9.5 版程序下载: 演示程序:
? 默认模式: ? 自定义按钮: ? 皮肤选择: ? 其它选项:
西林街 提供各种文档、视频资料、电子书和软件下载
? Javascript 交互: ? 非 utf-8 编码网页调用: ? UBB 可视化编辑: ? Ajax 图片上传:
7.表格类
(1)Flexigrid
Flexigrid 是一个类似于 Ext Gird,但基于 jQuery 开发的 Grid。它具有的功能包括:可 以调整列宽,合并列标题,分页,排序,显示/隐藏表格等。Flexigrid 显示的数据能够通过 Ajax 获取或者从一个普通的表格转换。
(2)Ingrid 这个 jQuery DataGrid 提供的功能有:可以拖动调整列宽,分页,排序,设置行/列样式 等。
西林街 提供各种文档、视频资料、电子书和软件下载
(3)jQuery Grid jqGrid 是一个 Ajaxed jQuery Grid 插件。提供分页功能,添加、编辑、删除和搜索表中 记录,支持多种数据类型输入:XML,JSON,Array 等,多行选择,支持子表格,集成日 期选择控件等等。
(4)tableHover tableHover 一个 jQuery 插件当鼠标经过时,能够对表格的一整列或行进行着色加亮。支 持 colspans 与 rowspans 的表格。
西林街 提供各种文档、视频资料、电子书和软件下载
(5)JQuery.Resizer 一个轻量级 jQuery 插件用于创建可以拖动调整行高与列宽的表格。 (6)tablesorter tablesorter 这个 jQuery 插件能够将带 THEAD 与 TBODY 标签的标准 HTMLTable 转换 成一个可排序的表格。tablesorter 能够排序多种数据类型包括 Text、URIs、integers、 currency、floats、IP 地址、日期、时间和自定义的数据类型。支持拥有复杂表头表格的 排序,支持二级隐藏排序,支持多种浏览器:IE6.0+、FF2+、Safari2.0+、Opera9.0+。
(7)csv2table csv2table 这个插件能够将 CVS 文件(利用 Excel 创建)的内容转换成 HTML Table。 jQuery 表格排序插件,点击表格中对应列的头部单元,表格立即重新排序。 Tablesorter | Demo
西林街 提供各种文档、视频资料、电子书和软件下载
(8)tableFormSynch tableFormSynch 是一个表格与表单数据相互更新的 jQuery 插件。它提供的功能包括: 基于表单中的数据, 新增行。 删除所选择行, 并清除表单中的所有数据。 tableFormSynch 支持所有表单控件包括:checkboxes、radio、buttons 与<select>。
9.
DataTables
DataTables 是一个 jQuery 插件,能够让 HTML 表格很方便地实现分页、过滤和多栏排序等功能。 DataTables 可以使用本身自带的 CSS 样式,但还可以按自己的需要自定义 CSS 样式。它具有以下特征:
?
自适应栏宽
? 可保存表格状态 ? 可隐含列 ? 动态创建表格 ? Ajax 自动装载数据 ? 丰富的分页类型 ? 多栏排序和高亮显示
西林街 提供各种文档、视频资料、电子书和软件下载
10.jExpand jExpand 是一个可以让表格具备可伸缩功能的 jQuery 插件。利用这个功能可以帮助你 更好地组织表格,让表格承载更多的消息比如图片,列表,图表和其它元素。
8.色彩选择器类
(1) Farbtastic
Farbtastic 是一个 color picker 插件。它能够在一个页面中加入多个颜色选择控件,然后 每个控件关联到页面中的一个元素比如:文本输入框。
(2)jQuery Color Picker 一个简单的颜色选择控件。操作方式与 Adobe Photoshop 中颜色选择操作置。
西林街 提供各种文档、视频资料、电子书和软件下载
(3)iColorPicker iColorPicker 是一个只有 6KB 大小的 jQuery Color Picker。只要将输入框的 class 属性 设置为“iColorPicker”就能变一个漂亮的颜色选择器。
9.数据验证类
1. jQuery plugin: Validation jQuery 校验插件。
2.
Masked Input Plugin
Masked Input 这个 jQuery 插件让用户能够按照预先设定好的固定格式输入数据(如日期、 电话号码等)。
西林街 提供各种文档、视频资料、电子书和软件下载
jQuery password strength meter 用于检测密码强度的 jQuery 插件。
3
jVal
jQuery 表单校验插件。
4. jQuery formValidator
你可以划分多个校验组,每个组的校验都是互不影响。对一个表单对象,你只需要写一行代 码就可以轻松实现无数种(理论上)脚本控制。目前支持 5 种 大的校验方式,分别是: inputValidator(针对 input、textarea、select 控件的字符长度、值范围、选择个数的 控制)、 compareValidator(提供 2 个对象的比较,目前可以比较字符串和数值型)、 ajaxValidator(通过 ajax 到服务器上做数据校 验)、regexValidator(提供可扩展的 正则表达式库) 、functionValidator (可使用外部函数来做校验) 5.meioMask meioMask 是一个可以让用户按指定格式输入的 jQuery 插件。既可以使用预先设置的格 式,也在 class 属性中自定义输入格式。
西林街 提供各种文档、视频资料、电子书和软件下载
6.VanadiumJS VanadiumJS 是一个强大的客户端表单校验 jQuery 插件。完全可以定制校规则, VanadiumJS 默认提供的一些规则包括:必填、一些特定的格式、数字(integer, float)、 长度、checkboxes 是否接受。
10.报表类
1.
2.
Flot
Flot 一个纯 javascript 绘画库,基于 jQuery 开发。它能够在客户端根据任何数据集快速 生成图片。目前只能绘制线状图和柱状。
西林街 提供各种文档、视频资料、电子书和软件下载
3.
jQchart
基于 Canvas+jQuery,可拖放/交互的简单图形控件。
4
jquery.sparkline
这是一个用于生成迷你型线状图的 jQuery 插件。
5. jQuery Google Charts
西林街 提供各种文档、视频资料、电子书和软件下载
jQuery Google Charts 是一个封装 Google API charts 的 jQuery 插件,提供了更加简 易的使用方法。 6. jqPlot jqPlot 是一个 jQuery 绘图插件,可以利用它制作漂亮的线状图和柱状图。jqPlot 支持为 图表设置各种不同的样式。提供 Tooltips,数据点高亮显示等功能。
11.上传类
1. jqUploader 结合 Javascript 与 Flash 开发,拥有上传进度条的文件上传控件。
2.
jQuery Multiple File Upload Plugin
多文件上传插件(jQuery.MultiFile)能够让用户一次性选择多个要上传的文件。此外该插 件还提供一些基本的校验功能比如:文件扩展名校验。
3.
jQuery: Ajax file upload
Ajax 文件上传插件让用户能够很方便地上传多个文件而无需刷新页面。此外,可以使用任 何元素(图片,文字,按纽等)来触发文件选择窗口。
西林街 提供各种文档、视频资料、电子书和软件下载
12.日期时间类
1. jQuery UI Datepicker 基于 jQuery 开发的日期选择控件。
2.
Date Picker
Date Picker 一个采用 jQuery 开发的日期选择控件。支持同时显示多个月份日历,标记特 殊日期,易于通过 CSS 定制外观,自定义周的第一天,自定义月份和星期的显示名称。
3.
Date Range Picker
西林街 提供各种文档、视频资料、电子书和软件下载
基于 jQuery UI1.6 与 jQuery UI CSS 框架开发的日期选择控件。
13.圆角效果类
1. jQuery Corner
不需要图片就能够创建各种圆角形状的 jQuery 插件。
2.
JQuery Curvy Corners
西林街 提供各种文档、视频资料、电子书和软件下载
用于创建圆角的 jQuery 插件。压缩之后大小只有 9k。
3.
jQuery Corner
更多圆角效果的 jQuery 插件。
4.
jQuery Corners
西林街 提供各种文档、视频资料、电子书和软件下载
这是一个用于创建漂亮圆角效果的 jQuery 插件。不需要用到图片或其它特殊的标签。
14.评价类
(1)Creating a Dynamic Poll with jQuery and PHP
(2)Reddit-style Voting With PHP, MySQL And jQuery 一个不错的 ajax 投票效果
西林街 提供各种文档、视频资料、电子书和软件下载
(3) jQuery Ajax Rater Plugin
能够动态创建 Ajax Rater 的 jQuery 插件。
4.
Star Rating widget
采用 jQuery 框架开发的评价控件。
5.
jQuery Star Rating Plugin
Star Rating Plugin 是一个基于一组 radio input boxes 实现的星形评价控件。
6.
Ajax Poll
西林街 提供各种文档、视频资料、电子书和软件下载
利用 jQuery 的 Ajax 和动画效果并给合 PHP 开发的投票系统。
7.jQuery 投票调查组件
主要功能: 测试答题框 可作心理测试等测试题使用 问题和选项通过 questions.xml 设置 显示当前得分 显示当前答题进度 可作翻看选过的选项 通过不同的得分调取不同结果内容
西林街 提供各种文档、视频资料、电子书和软件下载
DEMO 地址 静态版本 DEMO 地址 XML 版本 文件打包下载 下面是装载 XML 版本的代码 完整的代码请 打包下载
15.虚拟键盘类
在进行一些高安全性 Web 设计时,为了用户输入表单信息的安全,往往不希望用户直接通过实体鼠标进 行操作,而是提供额外的 Web 虚拟鼠标来帮助用户完全某些隐私表单内容的输入,所以,就用到了本文 提及的 3 个 JavaScript 安全虚拟键盘插件。
西林街 提供各种文档、视频资料、电子书和软件下载
自定义 jQuery 虚拟小键盘插件 plugin
jQuery 小键盘 是一个用于创建安全表单输入的插件工具,提供友好的键盘界面接口。使得可以仅允许用 户输入数字、字母等限制性操作。
2.jQuery 虚拟键盘
一个创建 jQuery 虚拟键盘 的学习向导,教你一步一步地创建自己的 jQuery 虚拟键盘,而且必须得 JavaScript 脚本可以免费下载。安全性高的 Web 虚拟键盘在金融类网站的和要求高安全性的表单操作中 应用非常广泛。所以,学会如何编写一个优秀的 Web 安全虚拟键盘非常有用。
西林街 提供各种文档、视频资料、电子书和软件下载
3.Virtual keyboard 虚拟键盘
虚拟键盘被广泛应用在极高级别的网站开发中,包括在线银行类网站应用等。Virtual keyboards 能帮助 我们防止键盘操作记录,阻止用户进行某些特殊按键的限制操作, virtual keyboard 使用简单,支持多 种语言。
16.Form 元件扩展
(1)jQuery.combobox
西林街 提供各种文档、视频资料、电子书和软件下载
jQuery.combobox 是一个采用 jQuery 开发的 combobox 控件,可以使用 CSS 控制该 combobox 的外观,可以 设置各种不同风格的下拉动画效果。
(2)jquery button:对按钮的扩展
开发项目时,经常需要自已开发一些 UI 组件,在这里共享一个刚开发的 Button 控件,这 个 Button 使用很简单,只要加入相关的 CSS 和 JS 文件,这样页面中的所有 input 按扭 都将会被自动渲染为漂亮的个性化按扭,不需要写一句代码。 button.rar (72.00 kb)
(3)ContextMenu
用于创建右键弹出菜单的 jQuery 插件。
西林街 提供各种文档、视频资料、电子书和软件下载
(4)
(5)在链接旁边加一个小图标效果
Add a favicon near external links with jQuery 6 jNice
创建自定义外观的 Form 元素,功能与正常的 Form 元素相似。
西林街 提供各种文档、视频资料、电子书和软件下载
7. jQuery calculate
jQuery 计算插件,提供一些常用的数学计算功能比如:Sum、Average、Min、Max 等。
8.
jQuery select box
模仿 HTML select box 实现功能的一个下拉菜单。
9.
prettyCheckboxes
一个简单的 jQuery 插件用于定制 checkboxe 和 radio 按纽的外观。
10.
jGrow
西林街 提供各种文档、视频资料、电子书和软件下载
jGrow 这个 jQuery 插件能够让 textarea 根据文本的长度自动调整它的大小。
11.
jQuery Form Plugin
为表单(Form)提供全面 Ajax 支持,包括文件上传功能的 jQuery 插件。提供的方法/功能 包括:ajaxForm、ajaxSubmit、 formToArray、formSerialize、fieldSerialize、 fieldValue、 clearForm、 clearFields、 resetForm。 这些方法能够让你轻松地管理 Form 中的数据和 Form 无刷新提交。
12.
mcDropdown jQuery Plug-in
mcDropdown 是一个独特的 UI 控件,它能够让用户在一个复杂分级的树形下拉选项中进 行选择。
西林街 提供各种文档、视频资料、电子书和软件下载
13.
Create A Slider From A Select Box
这是一个漂亮的 jQuery 插件能够自动将 select boxes 转换成一个 sliders 控件。
14.
TextArea Resizer
这个 jQuery 插件提供 Resizer bar 可拖动调整 TextArea 大小。
西林街 提供各种文档、视频资料、电子书和软件下载
15. jQuery MultiSelect
jQuery MultiSelect 是一个可配置的 jQuery 插件。它将普通的列表框表单控件转换成带 有 CheckBox 的下拉列表控件。
16.
Editable(jQuery Editable Plugin)
这是一个真正可定制的 jQuery editableplugin。当前它能够将任意不可编辑的标签 (span、div、p...等)转换成可编辑的 textinput、password、 textarea、下拉列表 (drop-downlist)等标签。你可以利用它的 editableFactory 对象来扩展添加自己所需 的 input type。
17.
NicejForm
NiceJForm 是一个拥有完美外形的表单,它是基于 jquery 库的,NiceJForms 实际上是 个 jquery 插件,用来使表单看起来更为美观。这不是最终版本,我知道可以通过多种途径 改良它的脚本,但是至少,这是一个可以使用的稳定版本。非常感谢 Lucian Slatineanu 发布的 NiceJForm,在他的 blog 中你可以获得更多信息。
西林街 提供各种文档、视频资料、电子书和软件下载
18. jScrollPane
jScrollPane 这个 jQuery 插件可以让你通过简单的 CSS 设置就能够替换所有分块元素在 浏览器中默认的垂直滚动条样式。
19.利用 jQuery 制作类似 skype 的按钮效果. http://www.cssrain.cn/demo/skypebuttons/SkypeButton2.html 20.jCheckbox: 1. 效果图:
简介: jCheckbox 用于模拟 checkbox 的效果, 方便开发人员自定义外观, 由于所有的属性 都绑定到目标 checkbox, 所以不必担心状态保存或取值的问题...
西林街 提供各种文档、视频资料、电子书和软件下载
导航: 详细介绍 | 在线演示 (21)jQuery asmSelect
感谢博览群书 友情提供
21. Dropdown Check List jQuery widget
这个 jQuery 能够将普通的 select HTML 标签转换成一个下拉可多选 checkbox 控件。 22. jquery-image-dropdown
这个 jQuery 插件能够将普通的 select 下拉选择控件转换成,一个可以为下拉框中的每个 选项添加不同图标的控件。 23. Sexy Combo
Sexy Combo 是一个 jQuery 插件,它能够将默认的 selectboxes 转换成更吸引人和便于 使用的 comboboxes 控件。既可以让用户输入也可以从下拉选项中选择。 24. jqTransform jqTransform 是一个表单换肤插件 jQuery 插件,它能够为普通的表单 Form 加上漂亮的 外观。
西林街 提供各种文档、视频资料、电子书和软件下载
25. Stylish Select Box
Stylish Select Box 是一个用于创建可自定义下拉框外观风格的 jQuery 插件。 26. Reinventing a Drop Down with CSS and jQuery
利用 CSS jQuery 实现一个自定义的 Select 控件。可以定义外观,下拉项目除了文本还可 以加图片。 27. Linkselect
jQuery 插件 Linkselect 可以将下拉框转换成链接下拉显示,丰富下拉框的展示形式, 如 自定义下拉框外观,下拉框选择元素风格等,效果图如上 28. Elastic jQuery plugin
Elastic jQuery plugin 这个插件能够让 Textareas 随着输入内容的增加自动增长变化。 29. In-Field Labels jQuery Plugin
利用这个 jQuery 插件可以在文本输入框中加类似于图片水印的帮助说明文字。 当输入框获 得焦点时水印还不会消失,只有当输入字符时才会消失。 30. Pretty checkboxes with jQuery (演示地址)
西林街 提供各种文档、视频资料、电子书和软件下载
利用 CSS 和 jQuery 实现一个漂亮的 Checkboxes 控件。 31.jQuery shiftcheckbox plugin 这是一个让你按住 Shift 键,就可以同时选中一组 checkbox 的 jQuery 插件。 32.jNice 创建自定义外观的 Form 元素,功能与正常的 Form 元素相似。 33.
简介 ? 当前版本: 0.4.1 (02/15/2010 – Changelog) ? 示例 ? 下载 source (11.7 kb) 或 minified (6.5 kb), 还有 CSS file. 特点: ? 全面支持滚动条样式可配. ? 由可点击的标签代替组选项. ? 选项顶部有全选、全不选、关闭功能. ? 支持键盘.
西林街 提供各种文档、视频资料、电子书和软件下载
? 支持 5 种不同的回调函数. ? 用一个可配最大数量的 list 显示已选择的选项. ? 容易修改显示位置,消失速度,滚动容器的高度,链接文字,输入文字. 兼容性 多选组件兼容 jQuery 1.4.0+ 和所有 jQuery UI 1.7+的主题. 这个插件支持以下浏览 器:
? Firefox 2 – 3.6 ? IE 6 – 8 ? Chrome Beta/4 ? Safari 4 ? Opera 10 兼容性
17.游戏类
1.连连看
不需要 flash,使用 JQuery 的平移效果,自己完成的动画效果(使用的 google 首页的图 片) 托管到 Google 上了。地址: svn 下载地址:https://jsgame-llk.googlecode.com/svn/trunk
18.代码高亮类
西林街 提供各种文档、视频资料、电子书和软件下载
1. beautyOfCode
beautyOfCode 这个 jQuery 插件能够对 html 页面中各种源代码的语法进行着色显示。 封 装自 Syntaxhighlighter 并添加对 xhtml 兼容支持。 2. Chili Chili 是一个 jQuery 源代码语法着色/高亮插件。具有以下特性:
? ? ? ?
着色非常快,易于使用,完全可定制,文档丰富。 支持显示行号。 在 Internet Explorer、Firefox、Opera 和 Safari 等浏览器上显示同样的效果。 默认支持的源代码类型包括: 、 C C#、 CSS、 Delphi、 Java、 JavaScript、 LotusScript、 MySQL、PHP 和 XHTML。
?
完全支持正则表达式,包括反向引用。
3. Highlight plugin jQuery “Highlight” plugin 是一个能对任意页面标签, 当被选中时添加高亮提示的 jQuery 插件。主要用于提示表单填写。 18.地图类 1. GoogleMapsModal 使用 jQuery 插件 GoogleMapsModal 可以实现 Google 地图模拟功能,把 Google 地图 放在你需要的任何地方。 2. jMaps
西林街 提供各种文档、视频资料、电子书和软件下载
jMaps 是一个 jQuery 的插件,提供了简单的 API 来访问 Google 地图. 3. jQMaps jQMaps 是一个 jQuery 的插件,提供了简单的 API 来访问 Google 地图,可增加自定 义点、线。 4. jQuery Maps Interface jQuery Maps Interface 是一个 jQuery 的插件,对 google,yahoo 地图提供接口支持
综合类:
1.Jquery Easy UI 现在 JQuery 也有一个很好的 UI 插件了,几乎完全可以替代 ExtJS,下面来看看对比:
上图是 ExtJS 和 EasyUI 的界面对比,是不是很类似呢,很强大呢? 呵呵~~
西林街 提供各种文档、视频资料、电子书和软件下载
漂亮的消息弹出,支持遮罩效果。
这个效果也很酷~ 更多的酷炫功能请看下方功能列表。。。 Easy UI 的使用也非常地简单:
<script type="text/javascript" src="../jquery-1.4.2.min.js"></script> <script type="text/javascript" src="../jquery.easyui.min.js"></script>
与引用其它 JQuery 插件类似。具体使用可以参考官方地址: 下面是 Easy ui 目前提供的所有插件功能:
西林街 提供各种文档、视频资料、电子书和软件下载
Menu and Button Create a simple menu Create a Link Button Create a Menu Button Create a Split Button Layout Build border layout for Web Pages Complex layout on Panel Create Accordion Create Tabs Create XP style left panel DataGrid Convert a HTML table to DataGrid Add a pagination to DataGrid Get selected row data from DataGrid Add a toolbar to DataGrid Frozen columns for DataGrid Dynamic change DataGrid columns Formatting DataGrid columns Add sorting to DataGrid
西林街 提供各种文档、视频资料、电子书和软件下载
Create column groups in DataGrid CheckBox select on DataGrid Window My first window Custom window tools Window and Layout Create Dialog Tree Create Tree from markup Create Async Tree Append nodes to tree Form Submit a form with Ajax Add ComboTree field to a form Form Validation 用过 ExtJS 的朋友都知道,他与 JQuery 来比,ExtJS 是比较臃肿的一个 JS 框架, JQuery 它是一个公认的轻量级 JS 框架,而基于 JQuery 的 Easy UI 它能够完全胜任我们 的基本开发需求,并且比 ExtJS 要轻量许多。 赶快去体验吧,一定会对你的工作有很大帮助的!下载地址:
西林街 提供各种文档、视频资料、电子书和软件下载
其它类: jquery-aop
为 JavaScript 增加面向方面编程特性的 jQuery 插件。它能给任何函数添加 Advices(Before、与 Around)。
jquery-aop
xmlObjectifier
基于 jQuery 开发,能够把 XML DOM 转换成 JSON 的 JavaScript library。
xmlObjectifier
JQuery Portlets
这个 jQuery 插件提供一些 Portlets 功能包括:drag/drop,expand,collapse 等。
西林街 提供各种文档、视频资料、电子书和软件下载
JQuery Portlets
EasyDrag jQuery Plugin
这个 jQuery Plugin 能够为大部 DOM 元素添加拖放功能。
EasyDrag jQuery Plugin
1. Drag and Drop:
西林街 提供各种文档、视频资料、电子书和软件下载
效果图:
简介: dragndrop 为开发人员实现 dom 拖拽提供了更简单的方法, 并可以监视对象 dom 的 位置以便进行数据(position)存储... 导航: 详细介绍 | 在线演示
1. Resizable: 效果图:
简介: resizable 插件使 html dom resize 更易于实现(这句话真别扭)...
西林街 提供各种文档、视频资料、电子书和软件下载
jFeed jFeed 是一个基于 jQuery 开发的 RSS/ATOM Feed 解析器。 jFeed 能够解析 RSS0.91、 0.92、1.0、2.0 和 Atom1.0 Feeds。 jQuery.UI ProgressBar Widget 采用 jQuery 开发的进度条控件。
JQuery Progress Bar 基于 jQuery 开发的进度条控件。在其网站上提供一个可以显示文件上传进度的例子,服务 器端采用 PHP 处理。
jTemplates 基于 jQuery 开发的 javascript 模板引擎。 Animated Collapsible DIV
西林街 提供各种文档、视频资料、电子书和软件下载
为任何 DIV 层添加 Web2.0 风格的动画隐藏/显示效果。
Simple Effects Plugins jQuery 特效插件,可以实现收缩,隐藏,显示,淡入/淡出和上下滑动效果等.
jQuery.Hotkeys plugin 这个 jQuery 插件能够帮助你快速创建键盘触发事件。支持任意组合键。
西林街 提供各种文档、视频资料、电子书和软件下载
jMP3 jMP3 是一个采用 jQuery 开发的 JavaScript MP3 插放器,提供一种可以在页面上直接播 放 MP3 的简便方式。
Pure Pure 是一个基于 jQuery 开发, 能够动态生成 HTML 的 JavaScript 模板引擎。 支持 JSON 数据。 6. jPlayer jPlayer 是一个用于控制和播放 mp3 文件的 jQuery 插件。它在后台使用 Flash 来播放 mp3 文件,前台播放器外观完全可以使用 XHML/CSS 自定义。 jQuery 音乐播放器 基于 jPlyer 开发的音乐播放插件. 支持如下功能: 1,进度条播放 。 2,上一首,下一首,随机播放 。 3,播放完每一首后,自动播放下一首,如果下一首是最后一首,则自动播放第一首。
西林街 提供各种文档、视频资料、电子书和软件下载
4,支持鼠标滚动操作,能上下翻滚屏幕。 5,歌曲时间 倒计时 ,而不是从 0 开始计时。 Chain.js Chain.js 是一个提供数据绑定功能的 jQuery 插件。用于自动生成 Web 内容,有利于数据 与表现相分离。
ppDrag ppDrag 是一个让页面元素拥有拖移(Drag&Drop)效果的 jQuery 插件。
jqDnR jqDnR 一个轻量级 jQuery 插件能够让你拖拽任何元素、调整元素大小。
Scroll Follow
西林街 提供各种文档、视频资料、电子书和软件下载
Scroll Follow 是一个简单的 jQuery 插件。当滚动页面时,能够让 DOM 对象产生浮动跟 随效果。
jQuery Taconite Plugin 这个 jQuery 插件能够利用单个 Ajax 调用结果同时更新多个 DOM 对象。 jQuery URL Parser 用于解析 URLs 字符串的 jQuery 插件。方便你获取协议,主机,端口,查询参数,文件名,路径 等。
西林街 提供各种文档、视频资料、电子书和软件下载
jQuery.xml2json jQuery.xml2json 是一个能够将简单的 XML 转换成 JSON 对象的 jQuery 插件。 Ajaxify Ajaxify 这个 jQuery 插件能够将一个页面中的所有链接转换成 Ajax 加载和提交请求。
jQuery Address - Deep linking plugin。
从 CssRain.cn 作者:cssrain@gmail.com(admin)
西林街 提供各种文档、视频资料、电子书和软件下载
类似于瞄点技术( url#address ),使得浏览器的后退按钮生效。在 Ajax 应用中,可以使 用。演示: http://www.asual.com/jquery/address/samples/api/ 下载: quickSearch quickSearch,顾名思义是一个 jQuery 驱动的快速搜索插件,Ajax 显示搜索结果。