labelFadeInput is a plugin to show/hide message in input:text with title attribute. Message is set tough of title attribute

labelFadeInput

//demo: http://jsfiddle.net/uPvTm/8/

;(function($) {
   
    $.labelFadeInput = function () {
        ///use to set labelFadeInput in All input's with title
        ///ex: <input type='text' title='Any text here' />, use $.labelFadeinput(); 
        $('input:text[title]').each(function() {
             setEvents.call(this); 
        });
    };
    
    $.fn.labelFadeInput = function() {
        /// use with selector, this: $("my custom selector").labelFadeInput();
        ///ex: <input type='email' title='Email@thisFormat.com' />, use $("input[type='email']").labelFadeinput();
        return this.each(function() {
            setEvents.call(this);
        });
    };
    
    var setEvents = function() {
       $(this)
        .val($(this).attr('title'))
        .css({'color': '#888', 'font-style':'italic'})
        .focus(function() {
            
            if($(this).val() === $(this).attr('title')){
            
                $(this).css('font-style', 'normal').animate({ color: $(this).css('background-color')}, 200, 
                    function() {
                        $(this).val('').css('color', '#222');
                    }
                )
            }
        })
        .blur(function() {
            if($(this).val() == ''){
                $(this)
                    .css({'color': $(this).css('background-color'), 'font-style':'italic'})
                    .val($(this).attr('title'))
                    .animate({ color: '#888'}, 200);
            }
        });
   };
    
    ///obs: to use labelFadeInput is necessary title attribute in input tag and jQueryUI to use animate function
}(jQuery));