2012 年 2 月最流行的24个 jQuery 插件

     上个月，有许多的强大jQuery插件产生和新的版本发布，以下就是这些插件中最流行的24个。    <h2>1. <a href="/misc/goto?guid=4958328434916832093" target="_blank">turn.js</a> </h2>    <div align="center">     <a href="/misc/goto?guid=4958328434916832093" target="_blank"><img style="border-bottom:silver 1px solid;border-left:silver 1px solid;border-top:silver 1px solid;border-right:silver 1px solid;" border="0" alt="2012 年 2 月最流行的24个 jQuery 插件" src="https://simg.open-open.com/show/0d23fe52d415d02b9c38bff3cef583ca.jpg" width="560" height="150" /> </a>    </div> Adds a beautiful transition similar to real pages in a book or magazine for HTML5.    <br />    <br />    <h2>2. <a href="/misc/goto?guid=4958331315848946318" target="_blank">jQuery Scroll Path </a></h2>    <div align="center">     <a href="/misc/goto?guid=4958331315848946318" target="_blank"><img style="border-bottom:silver 1px solid;border-left:silver 1px solid;border-top:silver 1px solid;border-right:silver 1px solid;" border="0" alt="2012 年 2 月最流行的24个 jQuery 插件" src="https://simg.open-open.com/show/044ea2f7a87d7220eedea1e0070ecf81.jpg" width="560" height="150" /> </a>    </div> It's a plugin for defining custom scroll paths. It uses canvas flavored syntax to draw lines and arcs.    <br />    <br />    <h2>3. <a href="/misc/goto?guid=4958331317384246188" target="_blank">3D Gallery</a> </h2>    <div align="center">     <a href="/misc/goto?guid=4958331317384246188" target="_blank"><img style="border-bottom:silver 1px solid;border-left:silver 1px solid;border-top:silver 1px solid;border-right:silver 1px solid;" border="0" alt="2012 年 2 月最流行的24个 jQuery 插件" src="https://simg.open-open.com/show/294999bf4ce654fa1ac756a5a4db2dee.jpg" width="560" height="150" /> </a>    </div> An experimental 3D gallery that uses CSS 3D transforms.     <br />    <br />    <h2>4. <a href="/misc/goto?guid=4958331318913724607" target="_blank">Anystretch</a> </h2>    <div align="center">     <a href="/misc/goto?guid=4958331318913724607" target="_blank"><img style="border-bottom:silver 1px solid;border-left:silver 1px solid;border-top:silver 1px solid;border-right:silver 1px solid;" border="0" alt="2012 年 2 月最流行的24个 jQuery 插件" src="https://simg.open-open.com/show/ac79886abf2a8570573ee24cd5b69c8c.jpg" width="560" height="150" /> </a>    </div> Allows you to add a dynamically-resized background image to any page or block level element.    <br /> The image will stretch to fit the page/element, and will automatically resize as the window size changes.    <br />    <br />    <h2>5. <a href="/misc/goto?guid=4958331320446814210" target="_blank">noty </a></h2>    <div align="center">     <a href="/misc/goto?guid=4958331320446814210" target="_blank"><img style="border-bottom:silver 1px solid;border-left:silver 1px solid;border-top:silver 1px solid;border-right:silver 1px solid;" border="0" alt="2012 年 2 月最流行的24个 jQuery 插件" src="https://simg.open-open.com/show/50264fb04abc4be5638704e82017de17.jpg" width="560" height="150" /> </a>    </div> It makes it easy to create alert, success, error and confirmation messages as an alternative the standard alert dialog.    <br /> Each notification is added to a queue. The notifications can be positioned at the top, topCenter (like GMail), bottom, centre, top left or top right.    <br /> There are lots of other options in the API to customize the text, animation, speed, buttons and much more.    <br />    <br />    <h2>6. <a href="/misc/goto?guid=4958331321981466684" target="_blank">Page Scroller</a> </h2>    <div align="center">     <a href="/misc/goto?guid=4958331321981466684" target="_blank"><img style="border-bottom:silver 1px solid;border-left:silver 1px solid;border-top:silver 1px solid;border-right:silver 1px solid;" border="0" alt="2012 年 2 月最流行的24个 jQuery 插件" src="https://simg.open-open.com/show/4dcb6181d5da9e07b8042b0f1fc3b661.jpg" width="560" height="150" /> </a>    </div> A powerful JavaScript based smooth scrolling navigation system that utilizes the robust jQuery library. Created entirely with ease of use in mind, the plugin will work on any website.    <br />    <br />    <h2>7. <a href="/misc/goto?guid=4958331323513419740" target="_blank">Sequence.js </a></h2>    <div align="center">     <a href="/misc/goto?guid=4958331323513419740" target="_blank"><img style="border-bottom:silver 1px solid;border-left:silver 1px solid;border-top:silver 1px solid;border-right:silver 1px solid;" border="0" alt="2012 年 2 月最流行的24个 jQuery 插件" src="https://simg.open-open.com/show/d2e4f5b811673366835febeccaed9c48.jpg" width="560" height="150" /> </a>    </div> Sequence is the jQuery slider plugin with infinite style. It provides the complete functionality for a website slider without forcing you to use a set theme.    <br /> In fact, Sequence has no in-built theme, leaving you complete creative control to build a unique slider using only CSS3.    <br />    <br />    <h2>8. <a href="/misc/goto?guid=4958331325063899529" target="_blank">Curtain.js </a></h2>    <div align="center">     <a href="/misc/goto?guid=4958331325063899529" target="_blank"><img style="border-bottom:silver 1px solid;border-left:silver 1px solid;border-top:silver 1px solid;border-right:silver 1px solid;" border="0" alt="2012 年 2 月最流行的24个 jQuery 插件" src="https://simg.open-open.com/show/8bc6d0c20dfc2ddb961ac6f454169014.jpg" width="560" height="150" /> </a>    </div> This plugin allows you to create a web page with multiple fixed panels that unroll with an amusing effect. Exactly like a curtain rises.    <br />    <br />    <h2>9. <a href="/misc/goto?guid=4958331326604740284" target="_blank">Glisse.js </a></h2>    <div align="center">     <a href="/misc/goto?guid=4958331326604740284" target="_blank"><img style="border-bottom:silver 1px solid;border-left:silver 1px solid;border-top:silver 1px solid;border-right:silver 1px solid;" border="0" alt="2012 年 2 月最流行的24个 jQuery 插件" src="https://simg.open-open.com/show/cfa1018928f043bd6eb3712e6972bc5d.jpg" width="560" height="150" /> </a>    </div> jQuery plugin for creating a fully customizable photo viewer with beautiful CSS3 transition.    <br />    <br />    <h2>10. <a href="/misc/goto?guid=4958331328134429495" target="_blank">jQuery Shadow </a></h2>    <div align="center">     <a href="/misc/goto?guid=4958331328134429495" target="_blank"><img style="border-bottom:silver 1px solid;border-left:silver 1px solid;border-top:silver 1px solid;border-right:silver 1px solid;" border="0" alt="2012 年 2 月最流行的24个 jQuery 插件" src="https://simg.open-open.com/show/b481dd0a02d78235c45fd6bb18135717.jpg" width="560" height="150" /> </a>    </div> A plugin to create drop shadows of various types.    <br />    <br />    <h2>11. <a href="/misc/goto?guid=4958331329662873226" target="_blank">fullscreen.js </a></h2>    <div align="center">     <a href="/misc/goto?guid=4958331329662873226" target="_blank"><img style="border-bottom:silver 1px solid;border-left:silver 1px solid;border-top:silver 1px solid;border-right:silver 1px solid;" border="0" alt="2012 年 2 月最流行的24个 jQuery 插件" src="https://simg.open-open.com/show/3d9c2fc7d36d6b0336df73e1d9929cc3.jpg" width="560" height="150" /> </a>    </div> This jQuery plugin lets you create full screen galleries where the slides are shown on the entire screen using the full screen APIs provided by Firefox 10+ and Chrome 15+ (and possibly Safari 5.1+).    <br /> In all other browsers it falls back to displaying the slideshow in the entire view port.    <br />    <br />    <h2>12. <a href="/misc/goto?guid=4958331331189165990" target="_blank">jPages</a> </h2>    <div align="center">     <a href="/misc/goto?guid=4958331331189165990" target="_blank"><img style="border-bottom:silver 1px solid;border-left:silver 1px solid;border-top:silver 1px solid;border-right:silver 1px solid;" border="0" alt="2012 年 2 月最流行的24个 jQuery 插件" src="https://simg.open-open.com/show/caf7d629241f80af75f6549f0a593c62.jpg" width="560" height="150" /> </a>    </div> jPages is a client-side pagination plugin but it gives you a lot more features comparing to most of the other plugins for this purpose, such as auto page turn, key and scroll browse, showing items with delay, completely customizable navigation panel and also integration with Animate.css and Lazy Load.    <br />    <br />    <h2>13. <a href="/misc/goto?guid=4958331332718842710" target="_blank">jurlp</a> </h2>    <div align="center">     <a href="/misc/goto?guid=4958331332718842710" target="_blank"><img style="border-bottom:silver 1px solid;border-left:silver 1px solid;border-top:silver 1px solid;border-right:silver 1px solid;" border="0" alt="2012 年 2 月最流行的24个 jQuery 插件" src="https://simg.open-open.com/show/5018ea525f5a6aed5161fabdc6398787.jpg" width="560" height="150" /> </a>    </div> jQuery plugin for parsing, manipulating, filtering and monitoring URLs in "href" and "src" attributes within arbitrary elements (including document.location.href), as well as creating anchor elements from URLs found in HTML/text.    <br />    <br />    <h2>14. <a href="/misc/goto?guid=4958331334247269600" target="_blank">Metro JS</a> </h2>    <div align="center">     <a href="/misc/goto?guid=4958331334247269600" target="_blank"><img style="border-bottom:silver 1px solid;border-left:silver 1px solid;border-top:silver 1px solid;border-right:silver 1px solid;" border="0" alt="2012 年 2 月最流行的24个 jQuery 插件" src="https://simg.open-open.com/show/a834c837fc08ee9e1561b3f4fd581d8c.jpg" width="560" height="150" /> </a>    </div> jQuery plugin developed to easily enable Metro interfaces on the web. This release focuses on Live Tiles, the Application Bar and Theming. It's early in the development phase, but all features should work on at least IE7+(Win/WinPhone), Firefox, Chrome, Android, Opera, and Safari(OSX/iOS).    <br />    <br />    <h2>15. <a href="/misc/goto?guid=4958331335787829771" target="_blank">DataTables v1.9</a> </h2>    <div align="center">     <a href="/misc/goto?guid=4958331335787829771" target="_blank"><img style="border-bottom:silver 1px solid;border-left:silver 1px solid;border-top:silver 1px solid;border-right:silver 1px solid;" border="0" alt="2012 年 2 月最流行的24个 jQuery 插件" src="https://simg.open-open.com/show/d4c10cec4a83191ef441e70b364d9f71.jpg" width="560" height="150" /> </a>    </div> A highly flexible tool, based upon the foundations of progressive enhancement, which will add advanced interaction controls to any HTML table    <br />    <br />    <h2>16. <a href="/misc/goto?guid=4958331337316869462" target="_blank">SimpleVid </a></h2>    <div align="center">     <a href="/misc/goto?guid=4958331337316869462" target="_blank"><img style="border-bottom:silver 1px solid;border-left:silver 1px solid;border-top:silver 1px solid;border-right:silver 1px solid;" border="0" alt="2012 年 2 月最流行的24个 jQuery 插件" src="https://simg.open-open.com/show/f1fa085a3cfe7179cfac3d539cde3e27.jpg" width="560" height="150" /> </a>    </div> SimpleVid is a free and easy way to host and embed your own fluid videos. It uses flash to for browsers that don’t support h.264, so you can encode once as a baseline h.264 mp4 and play anywhere.    <br />    <br />    <h2>17. <a href="/misc/goto?guid=4958331338840871792" target="_blank">blur.js</a> </h2>    <div align="center">     <a href="/misc/goto?guid=4958331338840871792" target="_blank"><img style="border-bottom:silver 1px solid;border-left:silver 1px solid;border-top:silver 1px solid;border-right:silver 1px solid;" border="0" alt="2012 年 2 月最流行的24个 jQuery 插件" src="https://simg.open-open.com/show/509b35df028ce689dd9c3fdc5ccd352d.jpg" width="560" height="150" /> </a>    </div> jQuery plugin that produces psuedo-transparent blurred elements over other elements.    <br />    <br />    <h2>18. <a href="/misc/goto?guid=4958331340376525254" target="_blank">推ter Friends Widget v2.0 </a></h2>    <div align="center">     <a href="/misc/goto?guid=4958331340376525254" target="_blank"><img style="border-bottom:silver 1px solid;border-left:silver 1px solid;border-top:silver 1px solid;border-right:silver 1px solid;" border="0" alt="2012 年 2 月最流行的24个 jQuery 插件" src="https://simg.open-open.com/show/3962a933ec17bd214b1e466e0c0cecc0.jpg" width="560" height="150" /> </a>    </div> There is a 非死book like box, Google+ badge, what about a 推ter fan box?!    <br />    <br />    <h2>19. <a href="/misc/goto?guid=4958331341899878010" target="_blank">Bacon </a></h2>    <div align="center">     <a href="/misc/goto?guid=4958331341899878010" target="_blank"><img style="border-bottom:silver 1px solid;border-left:silver 1px solid;border-top:silver 1px solid;border-right:silver 1px solid;" border="0" alt="2012 年 2 月最流行的24个 jQuery 插件" src="https://simg.open-open.com/show/bc5daf0c8f567c01a0ba61623a22abfd.jpg" width="560" height="150" /> </a>    </div> Bacon is a jQuery plugin that allows you to wrap text around a bezier curve or a line.    <br />    <br />    <h2>20. <a href="/misc/goto?guid=4958331343417048792" target="_blank">Responsive Google Maps </a></h2>    <div align="center">     <a href="/misc/goto?guid=4958331343417048792" target="_blank"><img style="border-bottom:silver 1px solid;border-left:silver 1px solid;border-top:silver 1px solid;border-right:silver 1px solid;" border="0" alt="2012 年 2 月最流行的24个 jQuery 插件" src="https://simg.open-open.com/show/198764fde66a0ed7f096f270ddd91bdf.jpg" width="560" height="150" /> </a>    </div> When scrolling a website on your mobile device you can get trapped in a Google map due to the Maps scrollbar of death™. This plugin gives you a native Google maps on your website and a safe fallback to the static image API of Google maps for smaller devices.    <br />    <br />    <h2>21. <a href="/misc/goto?guid=4958331344946675405" target="_blank">ProQuo </a></h2>    <div align="center">     <a href="/misc/goto?guid=4958331344946675405" target="_blank"><img style="border-bottom:silver 1px solid;border-left:silver 1px solid;border-top:silver 1px solid;border-right:silver 1px solid;" border="0" alt="2012 年 2 月最流行的24个 jQuery 插件" src="https://simg.open-open.com/show/3f5ee5d1323514e02e32386e3ac29f40.jpg" width="560" height="150" /> </a>    </div> ProQuo is a quick way to encourage your readers to spread your content through 推ter. Simply define the regions in your markup that you would like to make “tweetable” and ProQuo will handle the rest.    <br />    <br />    <h2>22. <a href="/misc/goto?guid=4958331346489564497" target="_blank">Lazy Load v1.7 </a></h2>    <div align="center">     <a href="/misc/goto?guid=4958331346489564497" target="_blank"><img style="border-bottom:silver 1px solid;border-left:silver 1px solid;border-top:silver 1px solid;border-right:silver 1px solid;" border="0" alt="2012 年 2 月最流行的24个 jQuery 插件" src="https://simg.open-open.com/show/30ef1471c5f6c2b8b801fb33c9d3012c.jpg" width="560" height="150" /> </a>    </div> Lazy Load is a jQuery plugin to delay loading of images in long web pages. Images outside of viewport (visible part of web page) won't be loaded before user scrolls to them.    <br />    <br />    <h2>23. <a href="/misc/goto?guid=4958331348017879482" target="_blank">Flippy </a></h2>    <div align="center">     <a href="/misc/goto?guid=4958331348017879482" target="_blank"><img style="border-bottom:silver 1px solid;border-left:silver 1px solid;border-top:silver 1px solid;border-right:silver 1px solid;" border="0" alt="2012 年 2 月最流行的24个 jQuery 插件" src="https://simg.open-open.com/show/5807775ba3d61302c803b88efce8e9a6.jpg" width="560" height="150" /> </a>    </div> Flippy is a cross-browser flip effect plugin which allows you to flip whatever html element you want.    <br />    <br />    <h2>24. <a href="/misc/goto?guid=4958331349543406617" target="_blank">jQuery Geo v1.0a4</a> </h2>    <div align="center">     <a href="/misc/goto?guid=4958331349543406617" target="_blank"><img style="border-bottom:silver 1px solid;border-left:silver 1px solid;border-top:silver 1px solid;border-right:silver 1px solid;" border="0" alt="2012 年 2 月最流行的24个 jQuery 插件" src="https://simg.open-open.com/show/2cabdabcfe1159e259ff431ebd6113e8.jpg" width="560" height="150" /> </a>    </div> jQuery Geo, an open-source geospatial mapping project from Applied Geographics, provides a streamlined API for a large percentage of your online mapping needs. Whether you just want to display a map on a web page as quickly as possible or you are a more advanced GIS user, jQuery Geo can help!    <br />    <br /> 转自：http://www.moretechtips.net/2012/02/24-most-popular-jquery-plugins-of.html