Noticias

Entradas populares

Manual jQuery-Manejar eventos II

martes, 14 de diciembre de 2010 , Posted by edukt at 21:29


.toggle()
Este evento permite mostrar u ocultar elementos del DOM.
El siguiente ejemplo del evento toggle realiza la animación de los parrafos del documento escondiéndolos y mostrándolos.


<!DOCTYPE html>
<html>
<head>
<style>
p { background:#dad;
font-weight:bold;
font-size:16px; }
</style>
<script src="http://code.jquery.com/jquery-1.4.4.js"></script>
</head>
<body>
<button>Toggle 'em</button>


<p>Hiya</p>
<p>Such interesting text, eh?</p>
<script>
$("button").click(function () {
$("p").toggle("slow");
});
</script>


</body>
</html>


El evento clic del botón desencadena la ejecución de la función que utiliza el selectos de etiqueta de párrafo y toggle() se encarga de mostrarlo o esconderlo  con el atributo slow equivalente a 600 milisegundos.


Hover


Vincula dos manejadores(entrada y salida de mouse) a los elementos encontrados por medio de los selectores.


$("td").hover( function () { $(this).addClass("sobre"); }, function () { $(this).removeClass("saliendo"); } );


Este ejemplo cuando el ratón se coloca encima de una columna se le aplica la clase "sobre" y cuando se quita el puntero se aplica la clase "saliendo".

Currently have 0 comentarios:

Leave a Reply

Publicar un comentario