Autor Tema: jquery ejemplo focus cambiar css al hacer click sobre elemento efecto desvanecer (Leído 6103 veces)

anarubia · « **en:** 20 de Septiembre 2015, 15:31 »

Buenas tardes. ¿como sería este código en jquery , para dar onfocus y onblur al elemento input (nombre, email)?, gracias

Código: [Seleccionar]

<form action="registro.php" method="get" name="miFormulario" id="miFormulario" 
enctype="multipart/form-data">

<input type="text" name="usuario" id="usuario"  value="Escribe tu Nombre" tabindex=1
    onfocus="if (this.value == 'Escribe tu Nombre') {
        this.value = ''; this.style.background = 'transparent'; }"
    
    onblur="if (this.value == '') {
        this.value = 'Escribe tu Nombre';
     this.style.background = 'url(imagenes/online-red-icon.png)no-repeat'; }">
        

<input type="text"  name="email" id="email tabindex=2"
    value="Escribe tu email" 
    onfocus="if (this.value == 'Escribe tu email') {
        this.value = ''; this.style.background = 'transparent'; }"
    
    onblur="if (this.value == '') {
        this.value = 'Escribe tu email';
     this.style.background = 'url(imagenes/descarga.png)no-repeat'; }">
    
</form>

Ogramar · « **Respuesta #1 en:** 22 de Septiembre 2015, 09:03 »

Hola Ana, a ver si alguien se anima y te hace la traducción, mientras tanto recomendable consultar tutoriales jQuery como http://www.tutorialspoint.com/jquery/ ó http://www.w3schools.com/jquery/ u otros

Salu2

anarubia · « **Respuesta #2 en:** 22 de Septiembre 2015, 17:54 »

lo he intentado , pero no me sale, ¿ donde está el error? este es el código que he puesto
<script>
$(document).ready(function(){
$("usuario").focus ( function (){
$ ( this ). val ( '' );
$(this).css("background", "url(imagenes/online-red-icon.png)no-repeat");
}). blur ( function (){
$(this).val('Nombre');
$(this).css("background","url(imagenes/senal.png)no-repeat");
$(this).css("background-color", "gray"):
})
</script>

Ogramar · « **Respuesta #3 en:** 23 de Septiembre 2015, 08:47 »

Hola Ana fíjate en este ejemplo donde se usa focus (en este caso para mostrar un mensaje con efecto de desvanecimiento cuando se hace click sobre una casilla de formulario)

Código: [Seleccionar]

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script>
$(document).ready(function(){
    $("input").focus(function(){
        $("span").css({"display": "inline", "color": "red"}).fadeOut(2000);
    });
});
</script>
<style>
span {    display: none; }
</style>
</head>
<body>

<input>

<span>No olvides rellenar todos los campos</span>
<p>Hacer click en la casilla de datos</p>

</body>
</html>

anarubia · « **Respuesta #4 en:** 23 de Septiembre 2015, 09:43 »

Gracias saludos

Foros aprenderaprogramar.com
Didáctica y divulgación de la programación

Noticias:

Autor Tema: jquery ejemplo focus cambiar css al hacer click sobre elemento efecto desvanecer (Leído 6103 veces)

anarubia

jquery ejemplo focus cambiar css al hacer click sobre elemento efecto desvanecer

Ogramar

Re:jquery

anarubia

Re:jquery

Ogramar

Re:jquery ejemplo focus cambiar css al hacer click sobre elemento efecto desvanecer

anarubia

Re:jquery ejemplo focus cambiar css al hacer click sobre elemento efecto desvanecer

Preguntas y respuestas