jQuery Form Tips


"Form Tips" is a plugin for the popular javascript library jquery. It enables a form to draw default values or messages into input/textarea elements. The text is fetched from the title-attribute of the element.

It's not rocket science but a nice little helper for an everyday task!

Download Form Tips @ Google Code or read more on the blog


Of course, at first you need a current version of the jquery library. Go to the jquery website and get yourself a copy.

Next, insert the form tips plugin as shown below:

<script type="text/javascript" src="jquery.formtips.1.2.6.js"></script>

Now, attach the plugin code to some elements. In our example below we did the following:

$(document).ready(function() {

    $('form input.help, form textarea.help').formtips({
        tippedClass: 'tipped'


Finally, give your css-class a certain style (mabye lighten it up a little) to show the user that the "tipped" version provides some help-text. Put the default text into the title-attribute of the elements you selected to be tipped.

The result should look like the demo below.




Download via Google Code.