Posted in Featured, JavaScript, jQuery, Scripts, Tools, Web Design

Like this post? Share It :
  • Print
  • email
  • PDF
  • Google Bookmarks
  • Facebook
  • Twitter
  • MySpace
  • Yahoo! Buzz
  • del.icio.us
  • Digg
  • LinkedIn
  • StumbleUpon
  • Tumblr
  • Reddit
  • Technorati
  • Design Float
  • RSS

80 Useful (Free) jQuery Plugins to Enrich Your Site’s User Experience

Most of you already aware that jQuery is a lightweight JavaScript library that emphasizes interaction between JavaScript and HTML. it’s also known for fast and concise JavaScript Library that simplifies HTML document traversing, event handling, animating, and Ajax interactions for rapid web development. Or in developer’s words “write less, Do more”.

80 Useful (Free) jQuery Plugins to Enrich Your Site’s User Experience

Now days jQuery is on top of its charm and everyone from JavaScript world love to experiment with it. Because of the remarkable significance of JQuery in Designing field, it is an essential to keep yourself up-to-date with its Quality uses and Examples.

In this article, we’ll take a look at various freely available Powerful jQuery Plugins to Enrich Your Site’s User Experience.

 

For those, who don’t know what is jQuery? and what it can do? the please follow the link below for brief introduction.

You may be interested in the following related articles as well.

Feel free to join us and you are always welcome to share your thoughts that our readers may find helpful.

Don’t forget to subscribe to our RSS-feed and follow us on Twitter — for recent updates.

Excellent jQuery Plugins

01. Camera slideshow

instantShift - jQuery Plugin - Camera slideshow

It’s a slide show plugin. Camera slideshow is an open source project. It is tested on new browsers, but I tried to make it compatible with the old versions of Internet Explorer too (8 and 7).

Plugin Demo & Download Page

02. Nivo Slider

instantShift - jQuery Plugin - Nivo Slider

The Nivo Slider is beautiful and easy to use image slider. Completely free and totally open source, there literally is no better way to make your website look totally stunning. The features includes, 16 Beautiful Transition Effects, Simple and Flexible Setup, Loads of settings to tweak, uilt in directional and control navigation etc.

Plugin Demo Plugin Details & Download Page

03. Flexslider

instantShift - jQuery Plugin - Flexslider

FlexSlider was built to serve up the best responsive jQuery slider around. FlexSlider has been verified in Safari 4+, Chrome 4+, Firefox 3.6+, Opera 10+, and IE7+. iOS and Android devices are supported as well. jQuery versions 1.3+ are supported.

Plugin Demo Plugin Details & Download Page

04. Thumbnail Gallery

instantShift - jQuery Plugin - Thumbnail Gallery

Thumbnail Gallery JQuery plugin is a easy to use JQuery plugin for web developer to build JavaScript gallery on their web application. The gallery can be driven by xml. Easy setup and only minimum programming knowledge is needed. Best to showcase your photography portfolio.

Plugin Demo Plugin Details & Download Page

05. CoverScroll

instantShift - jQuery Plugin - CoverScroll

This is a CSS3 variant of the Apple’s CoverFlow design pattern.

Plugin Demo & Download Page

06. Wow Slider

instantShift - jQuery Plugin - Wow Slider

WOW Slider is a jQuery image slider with stunning visual effects (Blast, Fly, Blinds, Squares, Slices, Basic, Fade, Ken Burns, Stack, Stack vertical and Basic linear) and tons of professionally made templates. WOW Slider is packed with a point-and-click wizard to create fantastic sliders in a matter of seconds without coding and image editing.

Plugin Demo Plugin Details & Download Page

07. AnythingSlider

instantShift - jQuery Plugin - AnythingSlider

AnythingSlider is plain and simple slider which can slide any type of content. The feature includes, Next Slide / Previous Slide Arrows, Navigation tabs are built and added dynamically (any number of slides), Optional custom function for formatting navigation text, Auto-playing (optional feature, can start playing or stopped) etc.

Plugin Demo Plugin Details & Download Page

08. Cycle Plugin

instantShift - jQuery Plugin - 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.

Plugin Demo and Download Page

09. jParallax

instantShift - jQuery Plugin - jParallax

jParallax turns a selected element into a ‘window’, or viewport, and all its children into absolutely positioned layers that can be seen through the viewport. These layers move in response to the mouse, and, depending on their dimensions (and options for layer initialization), they move by different amounts, in a parallaxy kind of way.

Plugin Demo & Download Page

10. zLayers

instantShift - jQuery Plugin - zLayers

zLayers is a jQuery parallax plugin that allows you to orientate an element based on the position of your mouse to the page’s window, or element’s parent. zLayer is perfect for interactive illustrations and rich user experience through creative methods through a parallax effect. Best part about zLayer is how easy, lightweight, and quick the plugin is!

Plugin Demo & Download Page

11. Image Parallax

instantShift - jQuery Plugin - Image Parallax

This plugin will allow you to add the parallax effect into your pages with multiple images of your choice.

Plugin Demo Plugin Details & Download Page

12. jqFloat

instantShift - jQuery Plugin - jqFloat

jqFloat.js is a jQuery plugin that able to make any HTML objects appear to be “floating” on your web page. It helps create simple floating animation and make your websites come alive with these little “floating” object.

Plugin Demo Plugin Details & Download Page

13. Zoomer

instantShift - jQuery Plugin - Zoomer

This plugin allows you to easily transform your image lists into beautiful galleries with Flash-like zoom effects in them. It’s a simple but elegant way of giving your interfaces a nice little shine and at only 2KB in size, it’s both compact and surprisingly easy to use.

Plugin Demo Plugin Details & Download Page

14. Zoomooz

instantShift - jQuery Plugin - Zoomooz

Zoomooz is an easy-to-use jQuery plugin for making any web page element zoom.

Plugin Demo Plugin Details & Download Page

15. JQZoom

instantShift - jQuery Plugin - JQZoom

JQZoom allows you to realize a small magnifier window close to the image or images on your web page easily.

Plugin Demo Plugin Details & Download Page

16. gZoom

instantShift - jQuery Plugin - gZoom

Useful image zoom jquery plugin with many features like Zoom using mouse wheel hover, Moving mouse hover, Click on plus and minus to zoom etc.

Plugin Demo and Download Page

17. Cloud Zoom

instantShift - jQuery Plugin

Cloud Zoom is a free jQuery image zoom plugin, a comparable alternative to products such as Magic Zoom. Compared to the popular jQZoom plugin, Cloud Zoom is smaller, has more features and more robust compatability across browsers.

Plugin Demo & Download Page

18. AnythingZoomer

instantShift - jQuery Plugin

With this plugin, you will have a small area. You mouse over it. An area pops up giving you a zoomed in closer look. It’s flexible in many ways, in that the “small”, “large”, and “zoom” areas are all pretty easy to customize (via CSS). It’s inflexible in other ways, in that it doesn’t “automatically” work by cloning content or anything like that (which is arguably more flexible), and the HTML structure is fairly rigid.

Plugin Demo and Download Page

19. Hover zoom effect

instantShift - jQuery Plugin

The hover zoom effect basically reverse zooms an image while fading in a label on top of it when the mouse hovers over it. It makes for a pretty slick effect which could be used on thumbnails.

Plugin Demo Plugin Details & Download Page

20. Fancy Zoom

instantShift - jQuery Plugin

This plugin is the jQuery version on the fancy zoom effect. As describe on the fancy zoom web site, this effect is providing a smooth, clean, truly Mac-like effect, almost like it’s a function of Safari itself.

Plugin Demo and Download Page

21. Image Zoom

instantShift - jQuery Plugin

This plug-in makes links pointing to images open in the “Image Zoom”. Clicking a link will zoom out the clicked image to its target-image. Click anywhere on the image or the close-button to zoom the image back in. Only ~3k minified.

Plugin Details & Download Page

22. imgAreaSelect

instantShift - jQuery Plugin

imgAreaSelect is a jQuery plugin for selecting a rectangular area of an image. It allows web developers to easily implement image cropping functionality, as well as other user interface features, such as photo notes (like those on Flickr).

Plugin Demo and Download Page

23. Jcrop

instantShift - jQuery Plugin

Jcrop is the quick and easy way to add image cropping functionality to your web application. It combines the ease-of-use of a typical jQuery plugin with a powerful cross-platform DHTML cropping engine that is faithful to familiar desktop graphics applications.

Plugin Demo Plugin Details & Download Page

24. PHP & jQuery image upload and crop

instantShift - jQuery Plugin

As name implies this is a image upload and crop plugin which allows you to upload different types of images, JPG, GIFs and PNG. You can upload images and have a random file name.

Plugin Demo Plugin Details & Download Page

25. PhotoShoot

instantShift - jQuery Plugin

The jQuery PhotoShoot plugin gives you the ability to convert any div on your web page into a photo shooting effect, complete with a view finder.

Plugin Demo Plugin Details & Download Page

26. Arctext

instantShift - jQuery Plugin

Arctext lets you curving Text with CSS3 and jQuery. While CSS3 allows us to rotate letters, it is quite complicated to arrange each letter along a curved path. Arctext.js is a jQuery plugin that let’s you do exactly that. Based on Lettering.js, it calculates the right rotation of each letter and distributes the letters equally across the imaginary arc of the given radius.

Plugin Demo Plugin Details & Download Page

27. Lettering

instantShift - jQuery Plugin

Lettering.js, a jQuery plugin for managing the appearance of your web type. It is a great tool to help designers get a chokehold on their typography.

Plugin Demo Plugin Details & Download Page

28. FitText

instantShift - jQuery Plugin

FitText is a jQuery plugin for inflating web type. FitText makes font-sizes flexible. Use this plugin on your fluid or responsive layout to achieve scalable headlines that fill the width of a parent element.

Plugin Demo Plugin Details & Download Page

29. Textualizer

instantShift - jQuery Plugin

Textualizer is a jQuery plug-in that allows you to transition through blurbs of text. When transitioning to a new blurb, any character that is common to the next blurb is kept on the screen, and moved to its new position.

Plugin Demo Plugin Details & Download Page

30. Airport

instantShift - jQuery Plugin

Airport is a rather simple text effect plugin for JQuery. It emulates the style of those flickering information boards you sometimes find on airports and train stations.

Plugin Demo Plugin Details & Download Page

31. Moatext

instantShift - jQuery Plugin

You can use this jQuery plugin for adding flavor to your web site. By this plugin, text messages on your site are animated on mouse over.

Plugin Demo & Download Page

32. TextExt

instantShift - jQuery Plugin

TextExt is a plugin for jQuery which is designed to provide functionality such as tag input and autocomplete. The core design principle behind TextExt is modularity and extensibility. Each piece of functionality is separated from the main core and can act individually or together with other plugins. TextExt’s modular design allows you easily turn a standard HTML text input into a wide range of modern, tailored to your needs input field without bloating your source code and slowing down your site with the code that you aren’t using.

Plugin Demo & Download Page

33. TagBox

instantShift - jQuery Plugin

This is a jQuery plugin to help add tags like input in your forms.

Plugin Demo Plugin Details & Download Page

34. Three Dee

instantShift - jQuery Plugin

The jQuery Three Dee project is a plugin that transforms plain text into eye-popping 3D text.

Plugin Demo Plugin Details & Download Page

35. jqIsoText

instantShift - jQuery Plugin

With this plugin you can change size of letters in text. It starts from one font size and increment or decrement to other font size. On that way you will get something similar to isometric projection. That can be done for whole block of text or for every word in some text.

Plugin Demo Plugin Details & Download Page

36. slabText

instantShift - jQuery Plugin

a jQuery plugin for producing big, bold & responsive headlines. This script splits headlines into rows before resizing each row to fill the available horizontal space. The ideal number of characters to set on each row is calculated by dividing the available width by the CSS font-size – the script then uses this ideal character count to split the headline into word combinations that are displayed as separate rows of text.

Plugin Demo Plugin Details & Download Page

37. jQuery Approach

instantShift - jQuery Plugin

a jQuery plugin that allows you to animate CSS properties based on distance to an object. It works in a very similar manner to jQuery animate, however it animates over distance instead of time. The closer you get to the object, the more the style will be applied.

Plugin Demo Plugin Details & Download Page

38. jQuery Glow

instantShift - jQuery Plugin

Add the ability to make elements “glow” when you hover over them. For browsers that support the text-shadow CSS property, you can also add a halo. The halo only appears in browsers that support the text-shadow CSS property (like Safari). Without it, you can still make the text glow, but you can’t add the halo.

Plugin Demo Plugin Details & Download Page

39. BigText

instantShift - jQuery Plugin

At its simplest, the BigText jQuery plugin takes a single element and sizes the text inside of its child

s to fit the width of the parent element. Gives the text that lovely vertical alignment.

Plugin Demo Plugin Details & Download Page

40. jQuery Text Resizer

instantShift - jQuery Plugin

The Text Resizer plugin attempts to solve one problem: that of resizing text on demand by the user. A lot of us have visited sites, particularly news websites, where the user is given the option to enlarge or decrease the size of the website’s text. This is especially useful for sites where it is expected that older visitors will make use of the site.

Plugin Demo Plugin Details & Download Page

41. FormToWizard

instantShift - jQuery Plugin

This detailed tutorial will show you how to turn long webform into a wizard with “steps left” information.

Plugin Demo Plugin Details & Download Page

42. NobleCount

instantShift - jQuery Plugin

NobleCount… for a more ‘proper’ count of the characters remaining. This plugin allows you to dynamic display of the number of characters remaining in a textarea, Twitter-style.

Plugin Demo Plugin Details & Download Page

43. Keypad

instantShift - jQuery Plugin

A jQuery plugin that attaches a popup keyboard to a text field for mouse-driven entry or adds an inline keypad in a division or span.

Plugin Demo & Download Page

44. Show Password

instantShift - jQuery Plugin

This plugin works by adding a text field that takes the value of what is typed into the password field. Then, when the link is clicked the password field is hidden and the text field is shown.

Plugin Demo Plugin Details & Download Page

45. Fancy AJAX Contact Form

instantShift - jQuery Plugin

Providing a simple and reliable means of feedback from site visitors is a crucial part of any web presence. The most simple and common feedback channel are contact forms. In this tutorial we are going to make an AJAX contact form which leverages modern web development techniques.

Plugin Demo Plugin Details & Download Page

46. Collapser

instantShift - jQuery Plugin

JQuery collapser is a multipurpose collapser plugin made for expanding and collapsing elements. Can create a accordion, list collapser using this plugin.

Plugin Demo Plugin Details & Download Page

47. AJAX/jQuery/PHP Contact Form

instantShift - jQuery Plugin

This tutorial uses XHTML, CSS, jQuery and a little PHP to make a pop-up/modal contact form that validates whatever is entered into the form and then uses AJAX to send the form without refreshing the page.

Plugin Demo Plugin Details & Download Page

48. prettyCheckboxes

instantShift - jQuery Plugin

This script is for people who wants to have a consistent look for checkboxes across browser or those who simply want them to look better. By using this script you won’t loose any of the regular inputs usability.

Plugin Demo & Download Page

49. Uploadify

instantShift - jQuery Plugin

Uploadify is a jQuery plugin that integrates a fully-customizable multiple file upload utility on your website. It uses a mixture of JavaScript, ActionScript, and any server-side language to dynamically create an instance over any DOM element on a page.

Plugin Demo Plugin Details & Download Page

50. StickyForms

instantShift - jQuery Plugin

StickyForms is a jquery plugin that automatically saves all form fields into cookies, and then autofills those values on any form that shares element IDs across your site.

Plugin Demo Plugin Details & Download Page

51. jqTransform

instantShift - jQuery Plugin

This plugin is a jQuery styling plugin wich allows you to skin form elements.

Plugin Demo & Download Page

52. FlexBox

instantShift - jQuery Plugin

FlexBox is a jQuery plugin that is intended to be a very flexible replacement for html textboxes and dropdowns, optionally using Ajax to retrieve and bind JSON data. It can be used as a ComboBox, with optional per-result html templates or Suggest box, like Google’s search or Data-driven type-ahead input box.

Plugin Demo Plugin Details & Download Page

53. In-Field Labels

instantShift - jQuery Plugin

This is a simple plugin that turns properly formatted HTML forms into forms with in-field label support. Labels fade when the field is focussed and disappear when text entry begins. Clearing a field and leaving brings back the label.

Plugin Demo & Download Page

54. Mobily Blocks

instantShift - jQuery Plugin

jQuery plugin (2KB) that allows you to create an unordered list as an animated circle.

Plugin Demo Plugin Details & Download Page

55. infiniScroll

instantShift - jQuery Plugin

“infiniScroll” works for blog posts… but will work for anything where you scroll to get more data. Just like Twitter.com, Facebook status messages, etc. Instead of paginating items, why not just keep scrolling? We like to scroll more than we like to go to a new page in some cases. It’s easier to get to items, and you already paid the prices of loading, so why load again! Posts and tweets are one thing, but will also work same for leaderboards, portfolio items, anything where you want to load subsequent elements.

Plugin Demo & Download Page

56. Respond

instantShift - jQuery Plugin

The goal of this script is to provide a fast and lightweight (3kb minified / 1kb gzipped) script to enable responsive web designs in browsers that don’t support CSS3 Media Queries – in particular, Internet Explorer 8 and under. It’s written in such a way that it will probably patch support for other non-supporting browsers as well.

Plugin Demo Plugin Details & Download Page

57. Tipped

instantShift - jQuery Plugin

Tipped allows you to easily create beautiful tooltips using the jQuery JavaScript library.

Plugin Demo & Download Page

58. Quicksand

instantShift - jQuery Plugin

jQuery plugin for reordering and filtering items with a nice shuffling animation.

Plugin Demo Plugin Details & Download Page

59. Isotope

instantShift - jQuery Plugin

An exquisite jQuery plugin for magical layouts. Enables filtering, sorting, and dynamic layouts.

Plugin Demo & Download Page

60. PromptuMenu

instantShift - jQuery Plugin

A jQuery plugin that allows you to display list items in a similar way like a iPhone home screen. If item count exceeds the displayed items on one screen, users can swipe through screens.

Plugin Demo & Download Page

61. Turn.js

instantShift - jQuery Plugin

Turn.js is a plugin for jQuery that adds a beautiful transition similar to real pages in a book or magazine. It works in all modern browsers including touch devices.

Plugin Demo Plugin Details & Download Page

62. Scrollorama

instantShift - jQuery Plugin

The jQuery plugin for doing cool scrolly stuff.

Plugin Demo & Download Page

63. Scrollpath

instantShift - jQuery Plugin

A jQuery plugin for defining a custom path that the browser follows when scrolling. The plugin uses canvas flavored syntax for drawing paths, using the methods moveTo, lineTo and arc. To help with getting the path right, a canvas overlay with the path can be enabled when initating the plugin.

Plugin Demo Plugin Details & Download Page

64. scrolldeck

instantShift - jQuery Plugin

Scrolldeck is a jQuery plugin for making scrolling presentation decks.

Plugin Demo & Download Page

65. jmpress

instantShift - jQuery Plugin

A jQuery plugin to build a website on the infinite canvas.

Plugin Demo Plugin Details & Download Page

66. Fly Off Page

instantShift - jQuery Plugin

“Fly Off Page” will take selected elements and make them fly (not literally) off the page in a random or pre-defined direction. Customizable options include duration (of the animation), direction, tween (extend animation) and ‘retainSpace’ which allows you to retain, disregard or animate-out the space that the specified element once took up.

Plugin Demo Plugin Details & Download Page

67. Circulate

instantShift - jQuery Plugin

This plugin allows you to animate something and rotate in a circle. You can declare speed, height, and width. Those are pretty obvious / standard / expected parameters for a plugin like this.

Plugin Demo Plugin Details & Download Page

68. jMenu

instantShift - jQuery Plugin

jMenu is a jQuery plugin that enables us to create horizontal navigations with unlimited sub-menus. Besides jQuery, it also requires jQuery UI and supports all the effects of this library (like fadeIn or slideDown). The markup of the menu is pretty clean as it makes use of nested lists. The look and feel of the output is set in a CSS file so updating it without touching the JS code is possible.

Plugin Demo Plugin Details & Download Page

69. Google Maps Slider

instantShift - jQuery Plugin

This plugin allows you to attach event listeners to different thing, like the map itself or things inside the map. A simple example would be if a marker is clicked, you can change the zoom level of the map, change information shown elsewhere on the page, or really anything else you might want to do with JavaScript.

Plugin Demo Plugin Details & Download Page

70. News Ticker

instantShift - jQuery Plugin

An easy to use, slick and flexible news ticker in the style of the BBC News page ticker.

Plugin Demo Plugin Details & Download Page

71. FullCalendar

instantShift - jQuery Plugin

FullCalendar is a jQuery plugin that provides a full-sized, drag & drop calendar like the one below. It uses AJAX to fetch events on-the-fly for each month and is easily configured to use your own feed format (an extension is provided for Google Calendar). It is visually customizable and exposes hooks for user-triggered events (like clicking or dragging an event).

Plugin Demo Plugin Details & Download Page

72. Continuous Calendar

instantShift - jQuery Plugin

A jQuery calendar plugin which comes with may featurs like Date dragging, No pagination, continuous month flow, Range shifting by dragging, Range expand with Shift + Mouse click, Display current date, Allow disabling of dates, Month select, Week select, Popup support, Support for different date formats etc.

Plugin Demo & Download Page

73. Moment

instantShift - jQuery Plugin

Moment.js is a lightweight (3.7k) JavaScript date library for parsing, manipulating, and formatting dates.

Plugin Demo & Download Page

74. jQuery-Ajax Autosuggest Plugin

instantShift - jQuery Plugin

This plugin has the usual functionality with a little extra flexibility: multiple instances, passing custom parameters, the id and the value are returned, keyboard-controlled, and a few others… Almost anything you need from an autosuggest plugin you can do with the built-in options! I didn’t focus on style, the CSS file is small and very easily changed. I’ve included some examples of handing servers-side requests, but, outside the returned data requirements, that’s completely up to you – e.g.) if you’d like to limit the results returned you can pass an additional parameter to your server-side script, it’s not a built-in requirement.

Plugin Demo Plugin Details & Download Page

75. Flot

instantShift - jQuery Plugin

Flot is a pure JavaScript plotting library for jQuery. It produces graphical plots of arbitrary datasets on-the-fly client-side. The focus is on simple usage (all settings are optional), attractive looks and interactive features like zooming and mouse tracking.

Plugin Demo Plugin Details & Download Page

76. noty

instantShift - jQuery Plugin

noty is a jQuery plugin that makes it easy to create alert, success, error and confirmation messages as an alternative the standard alert dialog. Each notification is added to a queue. The notifications can be positioned at the top, topCenter (like GMail), bottom, center, top left, top right, bottom left or bottom right. There are lots of other options in the API to customise the text, animation, speed, buttons and much more.

Plugin Demo & Download Page

77. Notification Menu

instantShift - jQuery Plugin

A jQuery plugin to add notification bubbles and a notification list to any menu.

Plugin Demo Plugin Details & Download Page

78. jQuery CSS3 Notifications

instantShift - jQuery Plugin

Great looking CSS3 notifications in a lightweight script with an easy to use api. Perfect for any web app.

Plugin Demo Plugin Details & Download Page

79. Star Rating Plugin

instantShift - jQuery Plugin

The Star Rating Plugin is a plugin for the jQuery JavaScript library that creates a non-obstrusive star rating control based on a set of radio input boxes.

Plugin Demo & Download Page

80. UI Bootstrap

instantShift - jQuery Plugin

With this theme, not only do you get the ability to use Bootstrap-themed widgets, but you can now also use (most) of Twitter Bootstrap side-by-wide with it without components breaking visually.

Plugin Demo & Download Page

Find Something Missing?

While compiling this list, it’s always a possibility that we missed some other great jQuery plugins. Feel free to share it with us.


instantShift

Like this post? Share It :
  • Print
  • email
  • PDF
  • Google Bookmarks
  • Facebook
  • Twitter
  • MySpace
  • Yahoo! Buzz
  • del.icio.us
  • Digg
  • LinkedIn
  • StumbleUpon
  • Tumblr
  • Reddit
  • Technorati
  • Design Float
  • RSS

Related posts:

  1. 35 Highly Advanced Yet Simple To Use jQuery Plugins
  2. 21 Useful jQuery Plugins
  3. 40+ Fresh jQuery Image and Content Sliders Plugins
  4. Seven Premium Style jQuery Plugins And Tutorials To Display Images On Websites
  5. jQuery Textext – Tags, Autocomplete, AJAX Support for Input Field

Comments are closed.