
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html>

<head>

    <meta http-equiv="Content-type" content="text/html; charset=utf-8">

    <title>Demo del plugin con Jquery para modificar el aspecto y el texto de los input al tener el foco</title>

    

    <style type="text/css" media="screen">

        body {

            font-family: Verdana, sans-serif;

            font-size: 1em;

        }

        input {

            font-family: Verdana, sans-serif;

            font-size: 0.9em;

            padding: 5px;

            border: 2px solid #666;

        }            

        input.blur {

            color: #999;

        }

        input.cssfocus {

            color: #fff;

            background-color: #f00;

        }

    </style>

    

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

    <script type="text/javascript" src="hint.js"></script>

    <script type="text/javascript" charset="utf-8">

        $(function(){ 

            // todos los input que tenga un atributo title

            //$('input[title!=""]').hint();

            

            // todos los input, incluyendo el submit

            //$('input').hint();

            

            // todos los input menos el submit

            $('input:not(:submit)').hint();

        });

    </script>

</head>



<body>

    <h1>Demo del plugin con Jquery para modificar el aspecto y el texto de los input al tener el foco</h1>

    

    <p>Volver al artículo explicativo: <a href="../foco-inputs-formularios-jquery-css.php">cambiar el aspecto de los inputs al tener el foco con Jquery</a></p>



    <form action="">

        <label for="uno">Uno:</label>

        <input class="blur" name="uno" value="" id="uno" title="Texto opcional" type="text">

        <label for="dos">Dos:</label>

        <input class="blur" name="dos" value="" id="dos" type="text">

        <input value="Enviar" type="submit">

    </form>

</body>

</html>