Skip to main content

10 Must Have jQuery Plugins

By Sam Deering

JavaScript

Share:

Free JavaScript Book!

Write powerful, clean and maintainable JavaScript.

RRP $11.95

Once again, I’ve gathered some jQuery plugin goodies that are really great and useful. This is for you to have a great experience of using jQuery and learn how to use them properly as well.

So here they are:


1. Sliding Panel

In this plugin, you’ll have a sliding panel that slides to reveal its content. Of course, jQuery is used to make an easing and great animation to animate the height of the panel.

Source:
http://nettuts.com/javascript-ajax/build-a-top-panel-with-jquery/


2. Spoiler Revealer

This is a great jQuery plugin that hides content first then shows them later when a certain element was clicked.

Source:
http://css-tricks.com/examples/SpoilerRevealer/


3. FCBKcomplete

This replicates the famous Facebook dynamic inputs and auto-complete or pre-added values.

Source:
http://www.emposha.com/javascript/jquery/jquerymultiselect.html


4. Accessible Charts

This plugin is a proof that elements are usable to illustrate HTML table data. Put data in a table, allows it to remain accessible and for the visual stuffs chart can be shown there.

Source:
http://www.filamentgroup.com/lab/creating_accessible_charts_using_canvas_and_jquery


5. Text Size Slider

Control size of text in an article within a page using this plugin.


Source:
http://nettuts.com/tutorials/javascript-ajax/use-the-jquery-ui-to-control-the-size-of-your-text/


6. Slick Auto-Playing Slider

This plugin is very useful for displaying lots of content in a very small area.  It cycles through panels slowly and auto-plays different kinds of content, it also has an arrow indicator that serves as a visual indicator of which panel you’re currently on.


Source:
http://css-tricks.com/creating-a-slick-auto-playing-featured-content-slider/


7. FancyBox

This is a cool plugin that automatically scales images to fit in windows even if they are large. It has nice drop-shadow effect under the item that is zoomed. It can group items that are relevant to each other and can add navigation between them.

Source:
http://fancy.klade.lv/


8. Flip

This flips page elements in four directions.

Source:
http://lab.smashup.it/flip


9. Animated Cartoon Robot

This simulates a faux 3D animated background just like retro video games.

Source:
http://css-tricks.com/jquery-robot/


10. Jcrop

This is a quick and easy way to add image cropping functions to your Website. It uses the almighty cross-platform DHTML cropping engine that resembles to desktop graphic applications.

Source:
http://deepliquid.com/content/Jcrop.html

Sam Deering has 15+ years of programming and website development experience. He was a website consultant at Console, ABC News, Flight Centre, Sapient Nitro, and the QLD Government and runs a tech blog with over 1 million views per month. Currently, Sam is the Founder of Crypto News, Australia.

New books out now!

Learn valuable skills with a practical introduction to Python programming!


Give yourself more options and write higher quality CSS with CSS Optimization Basics.