JQuery和javascript優秀插件收集

JQuery插件庫: http://plugins.jquery.com/

有趣的時鐘: http://ynif.v099.10000net.cn/demo/shijian/3/shijian/index.html

別人收集信息
8個實用的頁面佈局和用戶界面jQuery插件http://blog.ui90.com/eight-practical-jquery-plugin-page-layout-and-user-interface.html
15款最好的 jQuery 網格佈局插件（Grid Plugins） http://www.cnblogs.com/lhb25/p/15-jquery-grid-plugins.html
2013年優秀jQuery插件 http://www.cnblogs.com/feng524822/p/3319534.html
2014年50個程序員最適用的免費JQuery插件 http://www.oschina.net/news/53614/useful-jquery-libraries
爲開發者準備的 10 個新鮮的框架 http://www.oschina.net/translate/10-fresh-frameworks-for-developers

 

全套UI:
全球jQuery的UI框架集錦，有國產DWZ框架入選 http://www.4wei.cn/archives/1001093
收集源於http://www.iteye.com/problems/85278
JQuery:
JQuery UI http://jqueryui.com/demos/
jquery-ui-bootstrap http://www.bootcss.com/p/jquery-ui-bootstrap/#overlay
DWZ富客戶端框架 http://j-ui.com/
Easy UI http://www.jeasyui.com/demo/main/index.php 半開源
quickui http://www.quickui.net/v3/pages/sample.html 免費和收費兩個版本
jqwidgets http://www.jqwidgets.com/jquery-widgets-demo/ 收費
LigerUI http://ligerui.com/, 更新很慢, 網上說問題不少,謹慎使用
JQuery Tools : http://jquerytools.org/demos/
kendo http://demos.kendoui.com/ 免費版本不提供後臺組件等, TreeGrid的實現http://mleibman.github.io/SlickGrid/examples/example5-collapsing.html,group實現 http://www.telerik.com/forums/how-to-set-grid-grouping-programatically
w2ui http://w2ui.com/web/demo，grid無分頁。
mini ui http://www.miniui.com/docs/api/index.html
OperaMasksUI一個完整的UI 官網https://code.google.com/p/operamasks-ui/ Demo http://ui.operamasks.org/website/demos.html
對話框 http://aui.github.io/artDialog
淘寶前段框架Kissy： http://docs.kissyui.com/1.4/docs/html/demo/index.html
前端開發框架選型清單 http://www.infoq.com/cn/news/2014/05/web-ui-framework?utm_source=infoq&utm_medium=popular_links_homepage

前端框架：樣式主題
Foundation - 我最喜歡的前端框架 http://foundation.zurb.com/index.html
Bootstrap - 最流行的 http://getbootstrap.com/
Pure - 從未用過，可是看起來很酷 http://purecss.io/
Polymer – Google Material Design全平臺實現的一部分，很酷的交互細節 （ 這行是Easy加的，GFWED http://www.polymer-project.org/
20 個免費的 Bootstrap 模板 http://www.oschina.net/news/53505/20-free-bootstrap-templates
Flat UI Flat UI http://www.bootcss.com/p/flat-ui/
分享22個最新的HTML & CSS3 UI開發工具
http://www.iteye.com/topic/1135071
2014年8月 10 個全新的 Bootstrap 3 管理模板 http://www.oschina.net/news/54800/10-new-bootstrap-3-admin-templates-august-2014
爲應用程序設計的 10 個超酷的圖標集 http://www.oschina.net/news/54982/10-cool-icon-sets-for-app-design

 

 

拖放佈局:
jQuery拖拽佈局插件Portal http://www.jq22.com/jquery-info364, 一些說明在http://www.jqcool.net/jquery-portalyi.html，IE9如下的就不要用了，看不到效果。
jQuery Protlets: http://sonspring.com/journal/jquery-portlets，詳解:http://a151555.iteye.com/blog/1853184
可拖放的佈局插件 gridster.js http://gridster.net/
gridster.js 這是神話般的拖動和拖放多列網格已經到來。Gridster是一個jQuery插件，容許創建直觀的拖動的佈局元素跨越多個列。http://gridster.net/， Internet Explorer 9+, Firefox, Chrome, Safari and Opera.
shapeshift http://mcpants.github.io/jquery.shapeshift/
jQuery拖放插件集合 http://www.jb51.net/article/30069.htm
UI Layout http://layout.jquery-dev.net/demos.cfm
freetile.js Freetile是一個jQuery的插件，使該組織的網頁內容在一個高效，動態和響應佈局。http://yconst.com/web/freetile/
有用的jQuery佈局插件推薦 http://www.zhangjiaojiao.cn/jquery/184.html
採用jquery ui的sorttable拖動排序插件實現拖動效果 http://www.helloweba.com/view-blog-72.html

靜態佈局
jLayout不錯的佈局 http://www.bramstein.com/projects/jlayout/jquery-plugin.html
網格佈局 Mason.js http://masonjs.com/
6款強大的建立和增強網站佈局的jQuery插件http://developer.51cto.com/art/201106/266708.htm
8個實用的頁面佈局和用戶界面jQuery插件http://blog.ui90.com/eight-practical-jquery-plugin-page-layout-and-user-interface.html

 

 

圖表
jQuery Visualize Plugin http://www.filamentgroup.com/examples/charting_v2/index_2.php,瀏覽器支持：IE6,7,8, Firefox 2, firefox 3.5, Safari 3, 4, Opera 9.
HTML5 canvas在IE中不支持可是Google維護了一個類庫能將Canvas翻譯成VML，這樣能夠容許在任意版本IE中運行
jQuery Sparklines 動態圖表 http://omnipotent.net/jquery.sparkline/#s-about
JavaScript圖表Highcharts http://www.highcharts.com/, 中文網http://www.hcharts.cn/, 演示 http://www.hcharts.cn/demo/index.php
在線進度條：http://preloaders.net/
用於構建交互式圖表的最佳 jQuery 圖表庫 http://www.oschina.net/translate/best-jquery-chart-libraries-for-building-interactive-charts
5個最頂級jQuery圖表類庫插件 http://www.gbtags.com/technology/jquery/jquerytop5charting/
10 個 jQuery 圖表插件推薦 http://blog.jobbole.com/21136/
jsPlumb jQuery插件 jsPlumb這個jQuery插件爲開發者提供了一種可視化鏈接網頁元素的方法 http://jsplumbtoolkit.com/demo/home/dom.html，
jsPlumb開發入門教程（實現html5拖拽連線）http://blog.csdn.net/zhaoxy_thu/article/details/9532143
Jquery+jsPlumb流程圖實現 http://hi.baidu.com/dlbup/item/125f24c982e61878ced4f802,
使用jsPlumb製做流程圖設計器http://www.cnblogs.com/lwme/p/use-jsplumb-make-flowChart-designer.html，
使用 JsPlumb 繪製拓撲圖的通用方法 http://blog.csdn.net/lovesqcc/article/details/14003987
NVD3.js http://www.oschina.net/p/nvd3js 是一個基於D3.js的開源圖表JavasScript 類庫，它可生成具備交互性的圖表，定製性也很是高。它可用於繪製線性圖、柱狀圖、餅圖等多種常見的圖表類型。它的使用方法也很是簡單，若是你正好用過 D3.js，上手是至關容易的。
Echarts動態加載圖表數據 http://www.iteye.com/topic/1134808

 

非JQuery UI:
1. dojo http://dojotoolkit.org/demos
2. openlaszlo http://www.openlaszlo.org/showcase
3. qooxdoo http://qooxdoo.org/demo
4. ZK http://www.zkoss.org/demo/
5. Bootstrap http://www.bootcss.com/
其餘: 沒查看過,不知道狀況怎麼樣
Fbootstrapp,BootMetro, Kickstrap, Foundation, GroundworkCSS, Gumby, HTML , ickStart, IVORY, Kube

 

Grid表格:
18個最好的 jQuery 表格插件 http://www.oschina.net/news/16973/18-best-jquery-data-table-plugin
jQuery treetable http://plugins.jquery.com/treetable/, demo: http://ludo.cubicphuse.nl/jquery-treetable/
jqGrid http://www.trirand.com/blog/jqgrid/jqgrid.html
jQuery Grid Plugin http://paramquery.com/demos
columnHover http://p.sohei.org/jquery-plugins/columnhover/jQuery插件，能夠當鼠標懸停時，能夠高亮表格中的整個列。
Sigma Grid(純javascript開發的Ajax數據表格，超級強大) http://www.cnblogs.com/ly5201314/archive/2009/07/21/1528009.html
datatables http://datatables.net/examples/index

 

對Grid的獨立排序工具
table sorter ，此插件能夠將帶有THEAD和TBODY標籤的標準HTML錶轉化成可排序表，而無需刷新頁面。Table sorter能夠成功地解析多種類型的數據並進行排序。
源碼http://tablesorter.com/docs//演示 http://tablesorter.com/docs/#Demo
jQuery Table，這是一個操做簡單的jQuery插件，可幫助你將數據建立成可排序的表格。
源碼http://codecanyon.net/item/jquery-table/2392027?ref=lvraa/演示http://codecanyon.net/item/jquery-table/full_screen_preview/2392027?ref=lvraa
Beautiful Data，這是個了不得的方法，能夠爲枯燥的HTML表增長分頁和排序功能。此插件也能夠用於指定了源文件的CSV和JSON數據。
源碼http://codecanyon.net/item/beautiful-data/132137?ref=lvraa/演示http://codecanyon.net/item/beautiful-data/full_screen_preview/132137?ref=lvraa
jQuery columnManager 插件，此插件能夠切換表中縱列內容的可見性（摺疊和展開它們），而且保存數據直到下次訪問。
源碼http://p.sohei.org/jquery-plugins/columnmanager//演示http://p.sohei.org/stuff/jquery/columnmanager/demo/demo.html

Excel表格
Handsontable 相似excel: http://handsontable.com/
7個跟excel相關的插件：7+ JQUERY MICROSOFT EXCEL TYPE PLUGINS
http://www.jquery4u.com/plugins/7-jquery-microsoft-excel-type-plugins/
dhtmlxSpreadsheet http://www.dhtmlx.com/docs/products/dhtmlxSpreadsheet/
jQuery.sheet http://www.visop-dev.com/Project+jQuery.sheet
Table Generator http://www.tablesgenerator.com/

 

菜單導航：
15 Fresh jQuery Menu Plugins and Tutorials http://speckyboy.com/2011/07/04/15-fresh-jquery-menu-plugins-and-tutorials/
jquery-simple-context-menu右鍵菜單 http://joewalnes.github.io/jquery-simple-context-menu/example.html
jQuery contextMenu 右鍵菜單 http://medialize.github.io/jQuery-contextMenu/demo.html，下載地址:https://github.com/medialize/jQuery-contextMenu
ddsmoothmenu無限級菜單 http://www.iteye.com/topic/1132911
具有八種不一樣方式滑出的菜單欄特效http://www.dglives.com/demo/slide-push-menus-source/
jQuery導航插件 One-Page-Nav http://www.oschina.net/p/one-page-nav
各類下拉菜單 ，多級下拉菜單，向上展開菜單 左側展開菜單 http://freejs.iteye.com/blog/2112430

 

 

上傳下載：
Plupload，很不錯的上傳插件 http://www.plupload.com/example_queuewidget.php
它的中文例子說明:http://www.aixueit.com/thread-304-1-1.html,若是想覆蓋事件和獲得返回值，就使用它的pluploadQueue()方法。注意：這個插件的文件在jsp上引入是有順序的，不然問題出在哪裏，都很難發現的。http://www.16kan.com/question/detail/134602.html
jQuery File Upload： http://blueimp.github.io/jQuery-File-Upload/
jquery.fileDownload.js Library 下載插件http://johnculviner.com/jquery-file-download-plugin-for-ajax-like-feature-rich-file-downloads/，Demo: http://jqueryfiledownload.apphb.com/

 

提示
菜單的冒泡效果:BubbleUp jQuery Plugin to Spice Up Your Menu http://bloggingexperiment.com/bubbleup-jquery-plugin
十個提示插件： http://medleyweb.com/web-dev/10-great-jquery-notification-plugins/
qTip 一個提示工具: http://craigsworks.com/projects/qtip/docs/,在對話框的使用 http://jsfiddle.net/EuJNf/4/
Toastr 一個模仿Android的提示工具 http://codeseven.github.io/toastr/demo.html,官網：http://codeseven.github.io/toastr/
Pines Notify http://pinesframework.org/pnotify/
Noty http://needim.github.com/noty/
jNotify http://www.myjqueryplugins.com/jNotify 支持ie7以上
Notify http://redeyeoperations.com/plugins/Notify/
Notify! http://www.greepit.com/notify/
Sticky http://thrivingkings.com/read/Sticky-A-super-simple-notification-system-built-with-jQuery
MiniJS Notification[包含許多功能] http://minijs.com/plugins/8/notification
jQuery Toast Message http://akquinet.github.com/jquery-toastmessage-plugin/
Gritter for jQuery http://boedesign.com/blog/2009/07/11/growl-for-jquery-gritter/
jQuery Notification Plugin http://www.9lessons.info/2011/10/jquery-notification-plugin.html
jQuery.toast – toast notifications http://plugins.jquery.com/toast/
--->Demo: http://htmlpreview.github.io/?https://github.com/Soldier-B/jquery.toast/blob/master/example/jquery.toast.html

 

幾個格式化輸入
http://digitalbush.com/projects/masked-input-plugin/
http://plentz.github.io/jquery-maskmoney/
密碼輸入: http://antelle.github.io/passfield/
jQuery Fileinput Plugin文件輸入框: http://jsfiddle.net/hleinone/UF4nr/
jQuery File Upload文件輸入框 http://blueimp.github.io/jQuery-File-Upload/
SCEditor編輯器 http://www.sceditor.com/
jQuery Autosize 文本框自動高寬度 http://www.jacklmoore.com/autosize/
jQuery Super Labels另類輸入提示 http://remy.bach.me.uk/superlabels_demo/
jWizard輸入提示 http://www.dbarnes.info/jWizard/#Demonstration

 

選擇器
Javascript image dropdown 3.5.2 一個不錯的下拉框 http://www.marghoobsuleman.com/mywork/jcomponents/image-dropdown/samples/index.html
是個不錯的下拉框：http://www.jquery4u.com/plugins/10-jquery-selectboxdrop-down-plugins/
chosen 相似下拉框多選插件 http://harvesthq.github.io/chosen/,使用方法和ie6問題：http://www.cnblogs.com/pshay/archive/2012/12/13/2813877.html
select2 http://ivaynberg.github.io/select2/
Selectize.js下拉多選 http://brianreavis.github.io/selectize.js/
4 個多才多藝的 jQuery 下拉菜單插件 http://panyongzheng.iteye.com/blog/1909865
Brute Select格式化下拉框 http://grassator.github.io/jquery-brute-select/
jquery.chained.js 連級數據 http://www.appelsiini.net/projects/chained/demo.html
multiselect兩邊多選框 http://loudev.com/
TextExt很好的下拉選擇器：http://textextjs.com/
DropKick.js一個自定義的下拉框 http://www.gbtags.com/gb/demoviewer/1801/e347550f-b4c7-48e6-837e-fbebe4505ce7/DropKick-master%7Cexample%7Cexamples.html.htm
dropdown-check-list 有checkbox的下拉框 https://code.google.com/p/dropdown-check-list/
自定義checkbox和radio的樣式 能夠換膚 http://freejs.iteye.com/blog/2082027

 

日期日曆時間
一些日期控件收集: http://www.itokit.com/2012/0822/74694.html
datepicker 97 http://www.my97.net/dp/demo/resource/2.1.asp
jQuery Date Input多語言日期 http://www.jonathanleighton.com/projects/date-input/
jQuery Calendar 一個不錯的日曆 http://opensource.teamdf.com/calendar/examples/week.html，文檔:http://opensource.teamdf.com/calendar/docs/
Ion.Calendar 2.0.0日期: http://ionden.com/a/plugins/ion.calendar/en.html
pickadate.js 日期時間 http://amsul.ca/pickadate.js/
continuous-calendar日曆 http://reaktor.github.io/jquery-continuous-calendar/
jquery-simple-datetimepicker 日期時間: http://mugifly.github.io/jquery-simple-datetimepicker/jquery.simple-dtpicker.html
zebra-datepicker日期 http://stefangabos.ro/jquery/zebra-datepicker/
jQuery UI Datepicker插件timepicker時分秒 http://free0007.iteye.com/blog/2080588

 

畫廊
Rondell畫廊 http://projects.sebastianhelzle.net/jquery.rondell/
jcarousel畫廊 http://sorgalla.com/jcarousel/
fotorama畫廊 http://fotorama.io/
jquery圖片幻燈片,Jquery特效 http://www.iteye.com/topic/1132110
30個精美的jQuery幻燈片效果插件和教程 http://www.cnblogs.com/lhb25/archive/2011/08/18/stunning-jquery-slider-plugins-and-tutorials.html
10個精選 jQuery 幻燈片插件 http://www.siqiboke.com/post/492.html
SLF一個很不錯的畫廊http://darsa.in/sly/#!examples
滿屏畫廊：http://buildinternet.com/project/supersized/

幻燈片
jquery圖片滾動特效banner http://www.17sucai.com/pins/demoshow/349
自動播放 http://bxslider.com/examples

在線編輯器:
KindEditor http://www.kindsoft.net/index.php
10 個免費的 jQuery 可視化編輯器插件 http://www.oschina.net/news/18329/10-free-jquery-rich-text-editors

滾動條
Scroller滾動條 http://www.benplum.com/formstone/scroller/
Perfect Scrollbar – 完美的 jQuery 滾動條插件 http://noraesae.github.io/perfect-scrollbar/
jScrollPane 滾動條插件 http://jscrollpane.kelvinluck.com/index.html#examples
jScroller2 滾動動畫 http://jscroller2.markusbordihn.de/

雜項
equalize.js 均衡的高度或寬度的元素的jQuery插件 http://tsvensen.github.io/equalize.js/
jQuery的滾動路徑,一個插件定義自定義的滾動路徑。這使用畫布味的語法來繪製直線和圓弧。http://joelb.me/scrollpath/
jQuery Knob 旋轉輸入 [url]http://effinroot.eiremedia.netdna-
cdn.com/repo/plugins/forms-controls/jquery-knob/index.html[/url]
textrange文本選擇 http://dwieeb.github.io/jquery-textrange/
Fancyform表單皮膚 http://lutrasoft.nl/jQuery/fancyform/
jQuery.dForm js表單控件 http://jsfiddle.net/Zt4Rz/
jQuery Custom Forms 表單皮膚: http://vebersol.net/demos/jquery-custom-forms/
jQuery++增強插件 http://jquerypp.com/
放大縮小 http://jaukia.github.io/zoomooz/
jsTree 樹插件 http://jstree.com/demo
zTree: http://www.ztree.me/v3/demo.php
equalize.js 自動適應寬度高度 http://tsvensen.github.io/equalize.js/
控件牆 http://jquery-jkit.com/
Kwicks for jQuery 別緻的手風琴效果 http://devsmash.com/projects/kwicks
miniTip jQuery Plugin 提示插件http://goldfirestudios.com/blog/81/miniTip-jQuery-Plugin
Smallipop 提示插件 http://projects.sebastianhelzle.net/jquery.smallipop
jQuery Fullscreen 最大化插件 https://github.com/private-face/jquery.fullscreen
dragend JS橫向拖動翻頁 http://stereobit.github.io/dragend/
jQuery.bPopup.js彈出框 http://dinbror.dk/bpopup/
jquery按條件篩選產品效果 相似京東選擇：http://www.97zzw.com/plus/demonstrate.php?aid=1197
http://www.97zzw.com/jscode/other/1197.html
xml2json-xslt xml跟json轉換插件 https://code.google.com/p/xml2json-xslt/
Tab 10款實用的 jQuery Tab 切換插件和教程 http://www.cnblogs.com/lhb25/archive/2012/11/26/10-useful-jquery-tab-plugins.html
Base64編碼插件:http://plugins.jquery.com/base64/
jQuery MD5 加密插件及使用方法 http://www.veryhuo.com/a/view/14299.html
jquery生成pdf插件jsPDF http://www.iteye.com/topic/1134811
jQuery 插件 shCircleLoader載入插件 http://www.oschina.net/p/shcircleloader
jQuery貨幣格式化: http://www.jq22.com/jquery-info326, 例子: http://www.jq22.com/Demo326
時間格式化插件jquery-dateFormat http://ajia.github.io/blog/2013/06/07/shi-jian-ge-shi-hua-cha-jian-jquery-dateformat/
Midnight.js 可讓你隨時切換固定的頁面頭部 http://www.oschina.net/p/midnight-js
colorpicke顏色選擇器 http://demo.jb51.net/js/2012/ColorPicker/,若是要選擇高版本的jquery,要修改源碼$("#colorpanel")的z-index=1000000,$("#_cclose").live('click'...)成$("#_cclose").on('click'...)
jQuery 複選框和單選框插件 checkBo http://www.oschina.net/p/checkbo
網站使用教程框架 Intro.js http://www.oschina.net/p/intro-js
jQuery Autosize 根據輸入內容自動調整文本框高度的Jquery插件 http://www.oschina.net/p/jquery-autosize

 

轉載自：http://www.cnblogs.com/lhb25/default.html