10 Very Useful jQuery Plugins for Web Developers I wasn’t aware of

October 17, 2009 · 22 comments

by Lars

brand new jquery

jQuery as a development platform is great and we see the result of this every day. It is almost hard to believe but every time I decide to look up a new jQuery Plugin to solve a task I find that the community is constantly providing new high quality solutions for free. The number of really bad contributions that I fell I waste my time on is very limited and this makes me come back for more. I guess most web developers fell this way right? Great thanks to everyone spending their precious time creating stuff we can all use. Below I have listed 10 great plugins I wasn’t aware of that I stumbles over today.


ElegantThemes
ThemeForest

Advertisement

Form extensions

Jquery Form Extensions is a small plugin to assist with common form-related tasks in jQuery. Really simple stuff but for anyone starting with jQuery it is really nice to have common form tasks encapsulated like this.

brand new jquery

jQuery BBQ: Back Button & Query Library

jQuery BBQ enables simple, yet powerful bookmarkable #hash history via a cross-browser window.onhashchange event. In addition, jQuery BBQ provides a full jQuery.deparam() method, along with both fragment and query string parse and merge utility methods.

  • Deserialize any params string, the document query string or fragment into an object, including the new jQuery.param format (coming in jQuery 1.4). (example)
  • Merge any URL plus query string or fragment params—in an object, params string or second URL (including the current document location)—into a new URL.
  • Update the “URL attribute” (ie. a[href], img[src], form[action], etc) in multiple elements, merging any URL plus query string or fragment params—in an object, params string or second URL (including the current document location)—into a new URL, which is then set into that attribute.
  • Push (and retrieve) bookmarkable, history-enabling “state” objects or strings onto the document fragment, allowing cross-browser back- and next-button functionality for dynamic web applications (example 1, example 2, example 3)
  • Bind event handlers to a normalized, cross-browser window.onhashchange event (example 1, example 2, example 3)

brand new jquery

SimplePager – jQuery paging plugin

The premise behind SimplePager is to allow for creating pagination with as little effort or configuration as possible. This pager plugin can page divs, paragraphs, list items or almost any other content. This is simple yet very powerful!

brand new jquery

Auto line-height jQuery Plugin

This plugin adjusts the line-height of selected elements in proportion to their width, relative to the font size. Image below illustrate the effect (left is plugin controlled). Demo

brand new jquery

scale9grid

This plugin adds support for scaling background images using a 9-grid. Developers can specify a grid for selected elements which causes the background-image to be scaled selectively, depending on what part of the grid the background lies.

Parts of the background which lie in the corners of the grid will not be scaled and parts in the sides of the grid will only be scaled in one direction. 9-Grid scaling can be applied to an element through one line of code. Demo

brand new jquery

jQuery UI Selectmenu Plugin

jQuery UI Selectmenu Plugin duplicate and extend the functionality of a native HTML select element, and lets you customize the look and feel, add icons, and create hierarchy within the options. This plugin simply look awesome!

brand new jquery

jQuery YouTube Playlist Plugin

YouTube Playlist Plugin allows you to turn an unordered list of YouTube links into a playlist. YouTubePlaylist will automatically embed YouTube video into your page and convert your list into a nice playlist.

Demo showing the plugin with default options.

Demo showing the plugin set up to act like a gallery of YouTube videos.

brand new jquery

Encrypting HTML Form Data With jCryption

jCryption is a

JavaScript HTML Form encryption plugin, which encrypts the POST/GET-Data that will be sent when you submit a form. Normally if you submit a form and you don’t use SSL, your data will be sent in plain text.
But SSL is neither supported by every webhost nor it’s easy to install/apply sometimes. This plugin solves the security problem….but dont think you can use it for payment services!

brand new jquery

Align With Plugin

Align With is a simple plugin to re-position one or more HTML elements to be aligned with another element. Elements can be aligned by corners, edges and centre-points – ideal for dynamic content such as menus and tooltips.

Examples:
Basic usage, only defining the two elements – will match the centres of each element:
jQuery(‘.moveMe’).alignWith(‘#stayput’);

Match the left mid points of each element:
jQuery(‘.moveMe’).alignWith(‘#stayput’, ‘l’);

Match the top left corners of each element:
jQuery(‘.moveMe’).alignWith(‘#stayput’, ‘tl’);

Match the top left corner of the moving element with the centre of the static element:
jQuery(‘.moveMe’).alignWith(‘#stayput’, ‘tlc’);

Match the top left corner of the moving element with the top right corner of the static element:
jQuery(‘.moveMe’).alignWith(‘#stayput’, ‘tltr’);

Match the top left corner of the moving element with the top right corner of the static element and add a 5px x/y offset:
jQuery(‘.moveMe’).alignWith(‘#stayput’, ‘tltr’, {x:5,y:5});

Match the top left corner of the moving element with the top right corner of the static element and append to the document body:
jQuery(‘.moveMe’).alignWith(‘#stayput’, ‘tltr’, {appendToBody:true});

qTip

qTip is an advanced tooltip plugin for the ever popular jQuery JavaScript framework. Built from the ground up to be user friendly, yet feature rich, qTip provides you with tons of features like rounded corners and speech bubble tips, and best of all… it’s completely free under the MIT license! You will find good examples and demos on the site.

brand new jquery

45+ jQuery Plugins for Form Enhancements

{ 8 comments… read them below or add one }

iPad Application Development September 23, 2010 at 9:37 am

Thanks for the nice information. I am sure, I will tweet this to my twitter account. This will help a lot of users.

Reply

Craig Thompson January 12, 2010 at 12:37 am

Loving having qTip on the top 10 list, and even as the header image! Remember to visit the forums f yu need any help integrating it guys, always glad to help out.

Reply

denbagus December 27, 2009 at 3:03 am

very useful information for me…thank you

Reply

Diaa Kasem December 20, 2009 at 3:28 pm

Great Collection, Didn’t know about the encryption plugin before.
Thank you.

Reply

dlv October 17, 2009 at 7:09 pm

wow, great list!! Some plugins are news for me
excellents!

thanks for share

Reply

India Designers October 16, 2009 at 12:32 pm

Really very useful plugins. Thanks for sharing.

Reply

joão October 14, 2009 at 3:14 pm

Love the form extensions jQuery plugin :)
Must try out the rest of them!
Thanks :)

Reply

web designer October 14, 2009 at 2:19 pm

Thanks Your information….

its very useful

Reply

Leave a Reply

Your email address will not be published. Required fields are marked *

{ 14 trackbacks }

Previous post:

Next post:


Web Analytics