Está en la página 1de 8

Eventos y Funciones jquery

Nombre: Sebastián Abril


Eventos del ratón
Funciones Jquery
1. delay()
Establece un retardo para todas las funciones en cola en los elementos
seleccionados
2. fadeOut()
Desvanece los elementos seleccionados
3. fadeIn()
Se desvanece en los elementos seleccionados

Ejemplo de los ocupando los 3 primeros

4. fadeTo()
Desvanece los elementos seleccionados a una opacidad dada
5. fadeToggle()
Alterna entre los métodos fadeIn () y fadeOut ()

6. finish()
Detiene, elimina y completa todas las animaciones en cola para los elementos
seleccionados
7. stop()
Detiene la animación en ejecución para los elementos seleccionados

8. toggle()
Alterna entre los métodos hide () y show ()
9. after()
Inserta contenido después de elementos seleccionados
10. append()
Inserta contenido al final de los elementos seleccionados

11. before()
Inserta contenido antes de elementos seleccionados
12. after()
Inserta contenido después de los elementos HTML seleccionados.

13. Función encadenamiento


El encadenamiento nos permite ejecutar múltiples métodos de jQuery (en el mismo
elemento) dentro de un solo estado.
14. addClass()
Añade una o más clases de los elementos seleccionados

15. removeClass()
Elimina una o más clases de los elementos seleccionados
Eventos Jquery

1. click() : pulsar una vez el ratón sobre un elemento:


$("#click").click(function() {
alert("click simple");
});

2. dblclick() : pulsar el ratón dos veces seguidas sobre un elemento:


$("#dblclick").dblclick(function() {
alert("doble click");
});

3. mousemove() : El evento se produce al mover el ratón sobre un elemento.


n1=0;
$("#capa2").mousemove(function(){
n1++;
$("#mousemove").html("mousemove: "+n1+" movimientos");
});

4. toggle() : El evento se produce al hacer click con el ratón. Tiene la particularidad de


que admite varias funciones, que se van alternando en su ejecución cuando el usuario
realiza clicks.
$("#toggle").toggle(function() {
$(this).css("color","red");
},
function() {
$(this).css("color","blue");
},
function() {
$(this).css("color","green");
});

5. keydown() : El evento se produce en el momento que se presiona una tecla,


independientemente de si se libera la presión o se mantiene. Se produce una única
vez en el momento exacto de la presión.
6. keypress() : Se produce al tener pulsada una tecla, Si se mantiene pulsada, el evento
se produce varias veces, de la misma manera que se escriben varios caracteres al
mantenerla pulsada. Se corresponde con el hecho de tener la tecla pulsada.
7. keyup() : El evento se produce en el momento de dejar de presionar una tecla que
teníamos pulsada.

$(document).keydown(function(){
$("#teclado").html("tecla pulsada");
});
$(document).keyup(function(){
$("#teclado").html("tecla sin pulsar");
});

8. mouseleave()
El mouseleave() método atribuye una función de controlador de eventos para un
elemento HTML.

9. focus()
El focus() método atribuye una función de controlador de eventos a un campo de
formulario HTML.

10. on()
on() método se conecta uno o más controladores de eventos para los elementos
seleccionados.
$("p").on({
mouseenter: function(){
$(this).css("background-color", "lightgray");
},
mouseleave: function(){
$(this).css("background-color", "lightblue");
},
click: function(){
$(this).css("background-color", "yellow");
}
});

También podría gustarte