Pauta Ativa No Formulario C/ Jquery

Esse plugin visa aumentar a usabilidade em formulários, destacando em qual area o usuário está interagindo.

/**
 * Author: Franklin Javier Gonzalez
 * Date: 08/19/2010
 * Version: 1.0a
 * 
 * If you use this script, please link back to the source
 *
 * Please report any bug at contato@franklinjavier.com
 * Copyright (c) 2010 Franklin Javier http://www.franklinjavier.com
 *
 * Released under the Creative Commons Attribution 3.0 Unported License,
 * as defined here: http://creativecommons.org/licenses/by/3.0/
 *  
 */
(function($){

        jQuery.fn.highlightRow = function(){

                var $thisContainer = $(this);
                
                $thisContainer.find("input, select").bind("focus", function(){ 
                                
                        var parents     = $(this).parents("li");
                        var parent      = $(parents.get(0));
                        
                        parent.addClass("active", "slow");

                }).bind("blur", function(){

                        var parents     = $(this).parents("li");
                        var parent      = $(parents.get(0));
                        
                        parent.removeClass("active", "slow");

                });

        }
})(jQuery);

<form action="" method="POST">
        <fieldset>
                <ul>
                        <li>
                                <label>E-mail</label>
                                <input type="text" />
                        </li>
                        <li>
                                <label>Nascimento</label>
                                <input type="text" />
                        </li>
                        <li>
                                <label>Nickname</label>
                                <input type="text" />
                        </li>
                </ul>
        </fieldset>
        
        <input type="submit" value="Enviar" />
</form>

Pra testar basta usar:

$("form").highlightRow();

DEMO 

Posted in: Javascript