Development

35 Fresh and Useful jQuery Plugins

October 20th, 2009

Quick and powerful, jQuery can help designers and developers create awesome interactive websites that are appealing and accessible to the widest range of browsers. For your audience, the visit to your site will be both exciting and entertaining. Navigation, galleries and slideshows, are hot points for a site to shine.

Here are 35 useful fresh jQuery plugins focusing on navigation, gallery and slideshows, calendars, tab browsing and further resources to reduce time and effort while increasing your audience.

You may also want to consider our previous articles:

Navigation jQuery Plugins

Leopard Desktop with jQuery using jqDock
jQuery adds a whole lot of cool functionality to your websites. It can do a range of things, from animation to AJAX. This jQuery using jqDock can help you create a completely coded Dashboard like Leopard. It’s handy in hiding a whole lot of gadgets or widgets for which you don’t have space.

Leopard Desktop with jQuery using jqDock - Nettuts+

jQuery Keyboard Navigation Plugin
The jQuery Keyboard Navigation Plugin provides the capability for elements on a page to be navigated and activated via the keyboard’s up, down, right and left arrow keys.

jQuery Keyboard Navigation Plugin

jQuery Plugins
This plugin is for Ajax-driven pages to have back/forward navigation and to allow bookmarking.

jQuery (mb)Menu 2.6 (New!)
This is a powerful jQuery component to build a multilevel tree menu or a contextual menu with a right click in an intuitive yet easy way

jQuery (mb)Menu 2.6 (New!)

Advanced keypress navigation with jQuery
Based off “A fancy Apple.com-style search suggestion,” but new and improved with keypress accessibility, this handy keypress navigation in included with this useful jQuery resource.

Advanced keypress navigation with jQuery

Gallery and Slideshows jQuery Plugins

jQuery.popeye 1.0 released
This is major release, completely rewritten and overhauled, of jQuery.popeye. It is an image gallery plugin that started as an alternative to the famous JavaScript lightbox.

jQuery.popeye 1.0 released

Pikachoose jQuery Image Gallery (Demo)
Pikachoose is a lightweight jQuery plugin that allows easy presentation of photos with options for slideshows, navigation buttons, and auto play. Pikachoose is designed to be easy from installation to setup.

 Pikachoose jQuery Image Gallery

Supersized – Full Screen Background/Slideshow jQuery Plugin (Demo)
The Supersized jQuery plugin can resizes images to fill the browser while maintaining image dimension ratio. Additionally, it can cycle images/backgrounds via slideshow with transitions and preloading. The navigation controls allow for pause/play and forward/back.

Supersized - Full Screen Background/Slideshow jQuery Plugin

Easy Slider 1.5 – The Easiest jQuery Plugin For Sliding Images and Content
This Easy Slider 1.5 jQuery plugin offers many features such as auto slide, continuous sliding, "go to first” and “go to last” button, hiding controls, optional wrapping markup for control buttons, vertical sliding, multiple sliders on one page, and more.

Easy Slider 1.5 - The Easiest jQuery Plugin For Sliding Images and Content | Css Globe

jQuery lightbox for images, videos, YouTube, iframes – by Stephane Caron
prettyPhoto jQuery supports more than images. It also adds support for videos, flash, YouTube, and iFrames. It’s a full blown media lightbox that comes with useful APIs so prettyPhoto can be launched from nearly anywhere, including a flash USB.

jQuery lightbox for images, videos, YouTube, iframes - by Stephane Caron

Spacegallery – jQuery plugin
Spacegallery is a Javascript image gallery with a jQuery plugin. After setting parameters, images are animated with perspective style. When you click the front image, it fades in a smooth animation and is replaced with the next image. Although designed with one way navigation, it is a cool gallery when only a limited number of images need showcased.

Spacegallery - jQuery plugin

jquery-rotate – Google Code
This library is an extension for jQuery to rotate images directly within JavaScript. It works especially well when you need to organize your thumbnails without the lag of synchronous image operations via the web server.

  jquery-rotate - Google Code

Galleriffic | A jQuery plugin for rendering fast-performing photo galleries
Galleriffic is a high performance plugin for delivering a high volume of photos. Features include smart image preloading after the page is loaded, thumbnail navigation with pagination, support for bookmark-friendly URLs per-image, slideshow with optional auto-updating URL bookmarks, events that allow for adding your own custom transition effects, support for image captions, flexible configuration, graceful degradation when JavaScript is not available, and support for multiple galleries per page.

Galleriffic | A jQuery plugin for rendering fast-performing photo galleries

JQuery Cycle Plugin
The jQuery Cycle Plugin is a lightweight slideshow plugin. It supports pause-on-hover, auto-stop, auto-fit, before/after callbacks, click triggers and many transition effects. It also supports, but does not require, the Metadata Plugin and the Easing Plugin.

JQuery Cycle Plugin

jQuery Infinite Carousel
jQuery Infinite Carousel is a scrolling carousel that works in the same way the carousel worked on the Apple Mac ads page. This tutorial will walk you through the fundamentals of the effect and how to recreate it.

  jQuery Infinite Carousel

Fancybox
FancyBox is tool for displaying images, html content and multi-media in a Mac-style “lightbox” that floats overtop of web page. It was built using the jQuery library.

Fancybox

jQuery Flash Plugin
This jQuery plugin is for embedding Flash movies. Pages are progressively enhanced when Flash and JavaScript are available, and fallback to plain (X)HTML when they’re not. Replacements can happen as soon as the DOM is ready. (X)HTML, CSS and JavaScript stay separate, making it easy to remove, update or swap out later. Inspired by tools like SWFObject, UFO and sIFR, but written line-by-line for jQuery, no other scripts are required, meaning less redundancy, smaller filesize and faster loading.

jQuery Flash Plugin

Jquery Plugin MopBox 2.2
MopBox is draggable show box that can contain div, image , flashmovie, video, etc. If it has more than one child, the slider navigation is shown automatically and can be resizaable for one page of content.

Jquery Plugin MopBox 2.2

JQuery Media Plugin
The jQuery Media Plugin supports unobtrusive conversion of standard markup into rich media content. It can be used to embed virtually any media type, including Flash, Quicktime, Windows Media Player, Real Player, MP3, Silverlight, PDF and more, into a web page. The plugin converts an element (usually an “<a>”) into a <div> which holds the object.

JQuery Media Plugin

Calendars and Datepicker with jQuery

New jQuery Weekly Calendar Plugin
This jQuery Weekly Calendar Plugin makes it simple to integrate into any jQuery-UI based application. It’s based off the fullcalendar plugin, using the same event names where it makes sense and most importantly to use an identical data format. Now the two plugins can co-exist utilizing an identical data source and similar programming style.

New jQuery Weekly Calendar Plugin

Transcendent jQuery Date Range Selector + Short Cuts
Transcendent jQuery Date Range Selector + Short Cuts are packaged into a nice download so even a novice can enjoy these fantastic improvements to the standard Date Picker.

Transcendent jQuery Date Range Selector + Short Cuts

jNathanson.com
This is a jQuery timepicker plugin. To try different configuration options, set the options on the demo and then click again on field or clock.

jNathanson.com

Tab browsing with jQuery

tabSwitch
tabSwitch is a tab/slider plugin for jQuery. With this plugin, you can make a tab box system with the least of code and still fully customizable. Currently, you can choose from 7 different effects with 2 view styles, as well as hot swap the effects around in runtime.

tabSwitch

Autotab: jQuery auto-tabbing and filter plugin
Autotab is a jQuery plugin that provides auto-tabbing and filtering on textfields in a form. Once the maximum number of characters has been reached within a defined textfields, the focus is automatically set to the defined target of the element. Likewise, clearing out the textfield’s content by pressing backspace places the focus on the elements previous target. The purpose of this script is to easily establish auto-tabbing between multiple textfields.

Autotab: jQuery auto-tabbing and filter plugin

idTabs
idTabs is a plugin for jQuery. It makes adding tabs into a website super simple and opens the door to endless possibilities.

idTabs

jQuery Tabbed Content Rotator
jQuery UI is a library built on top of jQuery which allows you to create interactions, full-featured widgets, and animation effects. It is a tabbed content rotator.

jQuery Tabbed Content Rotator

Further useful jQuery Plugins

jQuery fade and slide toggle plugin
The jquery slidetoggle() is great, but but this plugin allows some opacity fading in the sliding animation. This is a very small plugin, but with different effects than regular sliding.

jQuery fade and slide toggle plugin Të  Position Absolute

jQuery pageSlide by Scott Robbin
jQuery pageSlide was inspired by the UI work of Aza Raskin who introduced the idea of sliding (or “throwing”) content aside to reveal a secondary content pane. This plugin allows any developer to recreate a similar interaction on their own website using a few simple lines of JavaScript. By attaching the method to an anchor tag, pageSlide wraps the original body content into a wrapper and creates an additional block for the secondary content load. The slide is animated whenever the click event is invoked.

jQuery pageSlide by Scott Robbin

s3Slider jQuery plugin
The s3Slider jQuery plugin shows how the layer appears. It can be on top or bottom, on left or right, or the layer can appear on all sides (left, right, bottom or top).

s3Slider jQuery plugin

jqModal :: Minimalistic Modaling for jQuery
jqModal is a plugin for jQuery to help display notices, dialogues, and modal windows in a web browser. It is flexible and tiny, akin to a “Swiss Army Knife”, and makes a great base as a general purpose windowing framework.

jqModal :: Minimalistic Modaling for jQuery

markItUp! Universal Markup Editor
markItUp! is not meant to be a “Full-Features-Out-of-the-Box”-editor. Instead it is a very lightweight, customizable and flexible engine made to meet the developer’s needs in their CMSes, blogs, forums or websites. markItUp! is not a WYSIWYG editor.

markItUp! Universal Markup Editor

Further Resources

jQuery Localisation
Localisation works by appending language indicators to the base package name to download and implement the contained overrides. If no specific language is given, the default setting for the browser is used. For example, if the browser is set for the languages English – Australian, then the greeting package causes the download and evaluation of the greeting-EN.js and greeting-en-AU.js files in that order.

jQuery Localisation

Minimalist jQuery: 11 useful plugins under 4K
jQuery makes our lives easier. So much so that it’s tempting to use it all the time, inadvertently slowing our page load times. Combining, compressing, and delivering scripts at the end of your page helps in the HTTP request department. On the file size front, below are jQuery plugins that give solid bang for your performance buck.

Minimalist jQuery: 11 useful plugins under 4K

All Marked Up / Projects / jQuery URL Parser
A jQuery plugin to parse URLs and provides easy access to information within them, such as the protocol, host, port, the segments that make up the path and the various query string values.

All Marked Up / Projects / jQuery URL Parser

File Style Plugin for jQuery
Browsers do not let you style file inputs. File Style plugin fixes this problem. It enables you to use image as browse button. You can also style filename field as normal textfield using CSS. It is written using JavaScript and jQuery.

  File Style Plugin for jQuery

Related posts

You may also want to consider our previous articles:

Tags:

38 comments for „35 Fresh and Useful jQuery Plugins
  1. designfollow on October 20th, 2009 at 7:55 am

    great article.

    thanks.

  2. Rob on October 20th, 2009 at 8:07 am

    Is it me or is the leopard link going to an article about SQL?

  3. bogdan on October 20th, 2009 at 8:08 am

    as I said I’ll always be among your first users reading articles about jQuery and CSS … very useful article ! … thank you !

  4. joyoge bookmark on October 20th, 2009 at 9:02 am

    nice plugins, thanks for share

  5. Gerard on October 20th, 2009 at 9:57 am

    absolutely useful! thanks

  6. Cameron Baney on October 20th, 2009 at 10:08 am

    Great post as usual! I love jQuery, and I will jump on any chance I can get to check out new plugins and ways to use it.

  7. Wendy Merritt on October 20th, 2009 at 10:16 am

    Great list of plugins. Some of these I already use but there are a couple I didn’t know about. I can’t wait to give these new ones a try!

    Blessings,
    Wendy

  8. loq on October 20th, 2009 at 10:25 am

    really2 amazing.i love jQuery Plugins.

  9. esranull on October 20th, 2009 at 11:06 am

    thanks, I need it

  10. esra on October 20th, 2009 at 11:07 am

    woww thanks best list

  11. amir on October 20th, 2009 at 12:34 pm

    tnx.very goood pack.

  12. habsdera on October 20th, 2009 at 2:37 pm

    Fresh? I don´t think so. Anyway good showcase.

    By the way, there is a new version o Easy Slider (1.7)

  13. Joe on October 20th, 2009 at 4:17 pm

    Great article, but you need to add jQuery Tools.
    http://flowplayer.org/tools/index.html

  14. Ben Dunkle on October 20th, 2009 at 6:31 pm

    No Shadowbox?

  15. babiblu on October 20th, 2009 at 7:20 pm

    I strongly suggest you view more details at S e e k R i c h B e a u t y . c O m where you have the opportunity dreaming about dating a millionaire and make it true!

  16. Ahmed on October 21st, 2009 at 1:54 am

    Very nice collection

  17. Emi Carmichael on October 21st, 2009 at 3:28 am

    Outstanding – thanks for this!

  18. Jesse on October 21st, 2009 at 5:26 am

    I’m partial to jQuery Tools myself. Thanks, tho’

    • Casey on October 21st, 2009 at 6:13 am

      came here to post that. jQuery Tools Rules! jquerytools.org

      basically all of this under one roof. With a CDN too!

  19. christian reyes on October 21st, 2009 at 6:30 am

    nifty compilation. thanks a bunch!

  20. Zohaib on October 22nd, 2009 at 8:20 am

    very useful. thanks for share

  21. Xander on October 22nd, 2009 at 4:40 pm

    Great jQuery collection :) Thank you for sharing

  22. deerua on October 25th, 2009 at 11:57 pm

    copypast rullz

    • martin-paris on January 13th, 2010 at 5:07 am

      Thx a lot, great article !

  23. Dan on October 26th, 2009 at 1:46 am

    These aren’t new. Bored.

  24. gt on October 28th, 2009 at 7:26 pm
  25. wparena on October 29th, 2009 at 4:12 am

    you always provide very informative sources..thanks for Google for us

  26. Adam Hermsdorfer on November 1st, 2009 at 12:20 pm

    jQuery rocks! I’m going to test out the fading slider alternative.

  27. alex on November 1st, 2009 at 4:23 pm

    Just found out about that jQuery Tools here… looks like it could be a serious time saver on projects. Thanks Noupe and commentators!

  28. Jannis Gerlinger on November 2nd, 2009 at 5:27 am

    This collection is awesome. I like especially the rotation scripts :)

  29. shawnp4h on November 5th, 2009 at 10:45 am

    Very Helpful.

    definitely I will use for my website designs…

  30. Alen on November 8th, 2009 at 5:08 am

    This collection is nice. I use some of them.

  31. ni_x on November 11th, 2009 at 10:23 pm

    I like this!

  32. webby on December 1st, 2009 at 11:24 am

    Very nice collection.

  33. denbagus on December 10th, 2009 at 6:06 pm

    nice information ..thank you

  34. Steve on March 25th, 2010 at 11:56 pm

    Thanks! Enjoyed looking through!

    Steve

    ImageArcade – Photography By Steve Ayres

  35. eglebird444 on July 3rd, 2010 at 6:18 am

    I like this too.