thumbnail

jQuery plugins are what web designers love most. From image sliders, to image galleries and navigation plugins, they are so many, so diverse, so amazing and interactive that can beautify a website instantly. Let`s take a look at 30 plugins which I consider a must when building websites. Of course, you can`t implement all of them, but I`m sure you`ll find them a use in your future projects.

jQuery Sliders

I`ll start with some jQuery slider plugins. Sliders are the most popular plugins used in webdesign and you can use them to showcase your products, latest posts or some interesting images.

Nivo Slider

The plugin is without a doubt the world most awesome jQuery Image Slider and comes with more than 15 transition effects.

nivo slider 30 jQuery Plugins You Should Implement on Your Website

Anything Slider

Anything Slider is the most versatile slider from all. You can add absolutely anything from videos to simple text and images, which is awesome.

anything slider 30 jQuery Plugins You Should Implement on Your Website

Slides

Slides is a slideshow plugin for jQuery that is built with simplicity in mind. Packed with a useful set of features to help novice and advanced developers alike create elegant and user-friendly slideshows.

slides 30 jQuery Plugins You Should Implement on Your Website

jQuery Cycle Plugin

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

cycle plugin 30 jQuery Plugins You Should Implement on Your Website

jQuery Roundabout

Roundabout is a jQuery plugin that converts a structure of static HTML elements into a highly customizable turntable-like interactive area.

jquery roundabout 30 jQuery Plugins You Should Implement on Your Website

Awkward Showcase

Awkward Showcase is a plugin for the JavaScript Framework jQuery. We call it a Content Slider. But it can do more than just slide the content. For example you can add tooltips, enable thumbnails, activate dynamic height and lots more.

awkward slider 30 jQuery Plugins You Should Implement on Your Website

Kwicks for jQuery

Kwicks for jQuery works like an accordion and looks great with some images and titles.

accordion slider 30 jQuery Plugins You Should Implement on Your Website

Jquery Slide Deck

jQuery Slide Deck is the web`s most powerful jQuery slider plugin.

slide deck 30 jQuery Plugins You Should Implement on Your Website

Navigation

Every website navigation needs to be clear, clean and interactive, therefore, there are some plugins which beautifies and make every website looking good.

Superfish

Superfish is an enhanced Suckerfish-style menu jQuery plugin that takes an existing pure CSS drop-down menu (so it degrades gracefully without JavaScript) and adds animation effects. It`s a very popular plugin being used by millions of websites and you can use it for your website as well.

superfish 30 jQuery Plugins You Should Implement on Your Website

jQuery Multi Level CSS Menu

This is a multi-level horizontal CSS menu created using a regular nested HTML list, then turned into a fully functional drop down menu using CSS and a touch of jQuery. The sub menus slide in and out into view, which also automatically reposition themselves horizontally if too close to the window’s right edge.

multi level 30 jQuery Plugins You Should Implement on Your Website

jBreadCrumb

jBreadCrumb plugin is a collapsible and interactive breadcrumb which was developed to deal with deeply nested, verbosely named pages. It is a good thing to use breadcrumb on your website, because your visitors have more control while navigating.

jbreadcrumbs 30 jQuery Plugins You Should Implement on Your Website

jQuery Mega Drop Down Menu

The jQuery Mega Drop Down Menu plugin takes any standard HTML nested lists and turns them into horizontal mega menus.
With some basic CSS styling the mega menus can be used to create unique and visually appealing navigation for any website.

mega menu 30 jQuery Plugins You Should Implement on Your Website

jQuery Vertical Mega Menu

This plugin creates vertical mega menus from standard HTML nested lists, allowing users to view all available menu options for each top-level menu item. Perfect to use for e-commerce websites.

vertical menu 30 jQuery Plugins You Should Implement on Your Website

Photo Galleries

A photo gallery needs to look nice and to be versatile and interactive, needs to be out of the box. There are a few plugins which fits for everything you need. Photography websites, products showcases or personal photos, you name it.

Supersized

This is an awesome plugin. I love it so much. Supersized is a fullscreen background slideshow built using the jQuery library which transform your website into a veritable photo slideshow. If you`re a photographer, you need Supersized!

supersized 30 jQuery Plugins You Should Implement on Your Website

Galleria

Galleria is a JavaScript image gallery framework built on top of the jQuery library. The aim is to simplify the process of creating professional image galleries for the web and mobile devices.

galleria 30 jQuery Plugins You Should Implement on Your Website

PrettyPhoto

prettyPhoto is a jQuery lightbox clone. Not only does it support images, it also support for videos, flash, YouTube, iframes and ajax. It’s a full blown media lightbox. It is very easy to setup, yet very flexible if you want to customize it a bit. Plus the script is compatible in every major browser, even IE6.

prettyphoto 30 jQuery Plugins You Should Implement on Your Website

SlideViewer

slideViewer is a lightweight (3.5Kb) jQuery plugin wich allows to instantly create an image gallery by writing just few lines of HTML such as an unordered list of images.

slideviewer 30 jQuery Plugins You Should Implement on Your Website

FancyBox

FancyBox is a tool for displaying images, html content and multi-media in a Mac-style “lightbox” that floats overtop of web page.

fancybox 30 jQuery Plugins You Should Implement on Your Website

ColorBox

ColorBox is a light-weight, customizable lightbox plugin for jQuery 1.3 through 1.6. Is working exactly like FancyBox, so you have from where to choose.

colorbox 30 jQuery Plugins You Should Implement on Your Website

jQuery Filter Plugins

Filtering, categorizing and reordering things is a nice way to implement in a webpage. Even for a portfolio or an e-commerce store, this plugins will save your day!

jQuery Quicksand Plugin

Quicksand is a jQuery plugin which allows you to reorder and filter items with a nice shuffling animation. Is very popular thanks to the amazing effects and versatility.

quicksand 30 jQuery Plugins You Should Implement on Your Website

HTML5 Portfolio

This is not a plugin, is actually an amazing tutorial which explains step by step how to build a beautiful HTML5 portfolio powered by jQuery and the Quicksand plugin. You can use it to showcase your latest work and it is fully customizable, so potentially you could expand it to do much more.

sortable portfolio 30 jQuery Plugins You Should Implement on Your Website

Filtering Blocks

Filtering Blocks works very well integrated into an e-commerce website. It was built for selling items and you can start using it for your own online shops.

filtering blocks 30 jQuery Plugins You Should Implement on Your Website

Isotope

Isotope is an exquisite jQuery plugin for magical layouts. It has a lot of features, a lot of filtering effects, layout and sorting options.

isotope 30 jQuery Plugins You Should Implement on Your Website

Miscellaneous

These plugins will help you transform your static website into a more dynamic one, so don`t hesitate to try them.

Tipsy

Tipsy is a jQuery plugin for creating a Facebook-like tooltips effect based on an anchor tag’s title attribute.

tipsy 30 jQuery Plugins You Should Implement on Your Website

Cufon Fonts

Cufon is not quite a plugin, is actually a service which allows you to transform any typeface into a javascript file and implement it into any page. This means that you can use for a website not only the standard fonts (Arial, Georgia), but any font you wish. This is a cool service and if you use it, you`re one step further to building perfect websites.

cufon 30 jQuery Plugins You Should Implement on Your Website

HTML5 jQuery Music Player

Do you want to integrate some music into a website? Grab the plugin and enjoy it!

video player 30 jQuery Plugins You Should Implement on Your Website

Circular Content Carousel

This is a simple circular carousel which slides infinitely. If you click on “More” button, a panel with content will open.

circular content carousel 30 jQuery Plugins You Should Implement on Your Website

LeanModal

LeanModal is a simple jQuery plugin which creates modal windows for your links. If you need a custom login window and want to make it looking nice, you should try leanModal.

modal box 30 jQuery Plugins You Should Implement on Your Website

jQuery Validation Plugin

This jQuery plugin makes simple clientside form validation trivial, while offering lots of option for customization. That makes a good choice if you’re building something new from scratch, but also when you’re trying to integrate it into an existing application with lots of existing markup.

validation 30 jQuery Plugins You Should Implement on Your Website

Animated Text and Icon Menu

This is a slick menu with a nice animation feature on hover. The idea is to make some elements slide out, change and animate the background color of the item and then slide the elements back in with a different color.

menu 30 jQuery Plugins You Should Implement on Your Website

jQuery News Ticker

Taking inspiration from the BBC News website ticker, jQuery News Ticker brings a lightweight and easy to use news ticker to jQuery.

news 30 jQuery Plugins You Should Implement on Your Website

Written by Madalin Tudose

Madalin Tudose is a web designer and developer who loves to inspect websites for new designing techniques and trends. He`s the founder of Ourtuts, where he blogs about anything related to web development.