10+ useful jQuery Plugins for web development

Introduction

I believe all of us have a list of favourite plugins that have been using it frequently in web development projects. I do have a list of plugins that really helped me and made my life so much better.

The plugins I listed in this post, I use most of them in developing another jquery script. There are small, eficient and robust, just really can save me a lot of works.

• jQuery Color | Demo
  Adds the ability to do color animations to jQuery. I'm quite surprise to find out that jQuery doesnt support it natively when I was writing the horizontal scrollbar menu tutorial.
• jQuery Easing | Demo
  A jQuery plugin to give advanced easing options. This is a fantastic plugin, I have been using this in some of my tutorials, I love it!
• jQuery Background-Position Animation | Demo
  Adds the ability to do background-position animations. This is really cool, just found it recently, and I believe it will be really useful in creating a menu with animated background.
• CSS Class-based Animations | Demo
  "You might like this plugin if you can't stand CSS/presentation creeping into your JavaScript through jQuery.animate calls. Keep presentation where it should be (in linked or inline CSS class definitions) and just animate to and from CSS classes." Yes, I agreed with that statement, keep the javascript clean. I often found myself mess up my script because of inconsistence CSS properties in CSS file and javascript file.
• jQuery dropshadow | Demo
  Add really nice drop shadow to your HTML elements. The appearance of the shadow is fully configurable. I found that it slow down the website if you have a lot of animation going on, apart from that, everything works great.
• jQuery Editable | Demo
  This is a real customizable jQuery editable plugin. Currently it can convert any tag (span, div, p and ...) to text input, password, textarea, drop-down list. You can easily extend it by adding your own input type using its editableFactory object.
• jQuery Masked Input | Demo
  I really really like this plugin. From a web developer point of view, this enforce the data format to reduce the amount of rubbish data and inconsistencies. I implemented it in some websites, and I've checked the data recorded in the database, the result was amazing.
• jQuery Form Clear | Demo
  This plugin was designed to help with User Interface Development. This lightweight plugin allows you to clear the value of text, password, and textarea fields when they have the default value or are blank.
• jQuery Empty value | Demo
  This is a terribly simple plugin (my first one, actually), used for the common practice of applying specific content and design (class name) for a form field while it's empty.
• jQuery Automated Image preloader | Demo
  This script parses through linked and imported stylesheets and creates an array of all the image urls they contain. Then it loops through the array of urls and creates an image object for each one so they'll be cached and ready for later use.
• jQuery Periodical Updater | Demo
  This plugin is a port of Prototype's Ajax.PeriodicalUpdater() function, which sends timed Ajax requests to the server, with a built in decay between requests if the content doesn't change. All options are configurable.

 

Let me know what's your favourite jquery plugins, you might have something that I don't know yet! :) Don't forget to share this article to show your support! :)

• TAGS:
• Javascript
• jQuery
• Plugin
• Tools