jQuery doesn’t need any introduction, jQuery is one of the well known and popular JavaScript Libraries on the web, jQuery is one of the most expedient and concise JavaScript Libraries which goes onto simplifying HTML document traversing, event handling, animating, and Ajax interactions, for rapid web development.
Presently, there are thousands of jQuery plug-ins available on the web which cover a wide range of functionality and enhancement features such as Ajax helpers, webservices, datagrids, dynamic lists, XML and XSLT tools, drag and drop, events, cookie handling, modal windows and a vast array of other web enhancing features which can transform a websites performance and appearance. An important source of jQuery plug-ins is the Plugins sub-domain of the jQuery Project website.
There are numerous Plugin Developers who have worked to extend the possibilities of the JQuery Library, and thousands more who contribute to the JQuery plugins repository which further extend the functionality of plugins available on the WP Plugin Repository, which provide plenty of opportunities for users to add new features and functionality to their WP self hosted websites. In this post we are featuring 11 JQuery Powerful Plugins which will allow you to take your WordPress-powered site well beyond just a mere Blog state. We hope some of the plugins listed below will be suitable for your own web related project. Enjoy !
1. Typehead.js : A Jquery Autocomplete Plugin by Twitter
Twitter has open sourced a very nice project named Typeahead.js for building smart auto-complete form fields. It comes as a jQuery plugin, shows suggestion as-users-type and can feature top suggestions with the help of styling. The plugin can work with both local or remote datasets and it is optimized for speed as it can prefetch the dataset, store it on the client-side and run the queries quickly.
Typeahead.js simply converts any text field into an auto-complete field, accepts JSON as the data source and has various settings for optimizing remote requests (rate limiting, maxConcurrentRequests, etc.).
[zilla_button url=”http://twitter.github.com/typeahead.js/” style=”black” size=”medium” type=”square” target=”_blank”] Download [/zilla_button]
2. jQuery Datagrid Plugin with a Powerful API : jui_datagrid
jui_datagrid is a jQuery plugin, making use of jQuery UI, that comes with lots of features for presenting and managing data. It has built-in pagination, sorting, editing, deleting and advanced searching. The datagrid can be used with any scripting language (a PHP class comes with the download package) and its look can be totally customized (Themeroller-friendly).
[zilla_button url=”http://www.pontikis.net/labs/jui_datagrid/” style=”black” size=”medium” type=”square” target=”_blank”] Download [/zilla_button]
3. Perfect Scrollbar : Custom Scrollbars with jQuery
Perfect Scrollbar is a lightweight (14kb) jQuery plugin for creating them without any hassle. It doesn’t ruin the default layout or require/apply any CSS changes. The plugin works with containers of any size and re-arranges the positions if a container-resize happens. Also, the design of the scrollbar can be customized completely with CSSand it supports jquery-mousewheel plugin in case you want to make use of it.
[zilla_button url=”http://noraesae.github.com/perfect-scrollbar/” style=”black” size=”medium” type=”square” target=”_blank”] Download [/zilla_button]
4. iLightBox : Impressive jQuery Model Box Plugin
Modal boxes are so functional in displaying any HTML content with a focused interface and there are many great ones around. iLightBox is a fresh alternative to other jQuery lightbox plugins and there is a strong chance that, although it is a paid resource, it may become your favorite. It can present images, videos (YouTube, Vimeo, HTML5 video), other HTML and there is an optional fullscreen mode. The gallery mode can display other items as thumbnails and allows browsing via keyboard, mousewheel and touch events (swipe).
[zilla_button url=”http://iprodev.com/ilightbox/” style=”black” size=”medium” type=”square” target=”_blank”] Download [/zilla_button]
5. Textillate : Flexible Text Animations with jQuery
Text animations in websites were so popular once Flash was used widely and now, simplistic, non-animated websites that put the content in front are the way to go. However, if used wisely, there is still room for such animations, and, a jQuery plugin named Textillate.js simplifies creating them. The plugin makes use of Animate.css + Lettering.js and it is capable of creating lots of animations like flash, bounce, shake, pulse, fade, rotate, flip and much more.
[zilla_button url=”http://jschr.github.com/textillate/” style=”black” size=”medium” type=”square” target=”_blank”] Download [/zilla_button]
6. Lazy Line : SVG Path Animations with jQuery
Lazy Line Painter is a pretty original jQuery plugin for preparing and presenting SVG path animations using jQuery. It works for any SVG file (any design can be exported with Illustrator in seconds) and simply by drag ‘n’ dropping it to an online generator provided by the plugin. And, after that, just insert that code into any web page and it will work. Various options exist for customization including the stroke width, color, speed and a callback that is triggered once the animation is completed. The plugin requires Raphaël besides jQuery and can be a nice way of presenting illustrations for graphic designers.
[zilla_button url=”http://lazylinepainter.info/” style=”black” size=”medium” type=”square” target=”_blank”] Download [/zilla_button]
7. Teamwork Gantt : A jQuery Component for Gantt Charts & Task Trees
Teamwork Gantt is a free jQuery component, created by Teamwork (a project management service), that simplifies generating Gantt charts. It has a wide array of features including zooming, drag ‘n’ drops, in-place-editing, resize, scroll and many more. There is support for exporting the data in JSON and the layout is skinnable with CSS.
[zilla_button url=”http://gantt.twproject.com/” style=”black” size=”medium” type=”square” target=”_blank”] Download [/zilla_button]
8. Flot : A Flexible Plotting Library for jQuery
Flot is a jQuery plugin for easily creating good-looking and interactive charts. The library uses HTML5 canvas for drawing, JSON as the data source and can render a data array with 1000s of items. It is not limited to any chart type and the community has already expanded it with multiple types (bar, line, pie, gantt, etc.) and features. There is support for zooming into any selected part and charts generated can respond to events.
[zilla_button url=”http://www.flotcharts.org/” style=”black” size=”medium” type=”square” target=”_blank”] Download [/zilla_button]
9. Elevate Zoom : jQuery Image Zooming Plugin with Built-in Gallery
elevateZoom is a highly-customizable jQuery plugin for creating image-zoom interfaces with ease. It can work with a single high-quality image or two images (a thumb and a high-quality version). The zoom window can be placed on any part of the page (or image) and there is also an option for inline-zooming which saves space. For inline-zooming, it is possible to use a lens image that shows the zoomed part inside. And, usually for displaying products, there is a gallery mode which can present multiple images with zoom functionality.
[zilla_button url=”http://www.elevateweb.co.uk/image-zoom/examples” style=”black” size=”medium” type=”square” target=”_blank”] Download [/zilla_button]
10. AyaSlider : A Jquery Slider with In-Slide Animations
ayaSlider is a flexible jQuery slider plugin with a very simple usage and setup. The slider can display an unlimited number of items where any HTML can be used for the slides. It has few options to define like the easeIn/easeOut values, the delay between each slide and the prev/next selectors. However, each slide can behave differently with the help of ” the options per slide”. These include the starting points of each animation, opacity, delay, easing and duration to be used.
[zilla_button url=”http://mamod.me/ayaSlider/” style=”black” size=”medium” type=”square” target=”_blank”] Download [/zilla_button]
11. ParamQuery : Dynamic Grids with jQuery
ParamQuery, a jQuery plugin, enables us to present the data in a similar way with lots of options. The records can be sorted or paginated, columns can be resized, hidden and it is possible to edit data inside cells with inline-editing. There is support for infinite scrolling which is nice when loading lots of records. It is capable of loading the data from any format like HTML, Array, XML, JSON, etc. and can be used with any scripting language.
[zilla_button url=”http://paramquery.com/” style=”black” size=”medium” type=”square” target=”_blank”] Download [/zilla_button]
