Uso de la funcion hover jQuery

Uso de hover en jQuery a partir de la versión 1.4

Uso de la funcion hover jQuery

Uso de hover en jQuery a partir de la versión 1.4

Uso de la función hover en jQuery para programadores en javascript , uso adecuado y consejos de como implementarlo en tus lineas de código del día a día

A partir de jQuery 1.4, ahora podemos pasar solo una función al método hover. Antes, se requerían los métodos de entrada y salida.

Los parámetros de hover():

  • selector (Obligatorio): Elemento donde queremos detectar la presencia del cursor del ratón.
  • inFunction (Obligatorio): Función a ejecutarse cuando el cursor está encima del elemento indicado.
  • outFunction (Opcional): Función callback a ejecutarse cuando el cursor ya no está encima del elemento indicado.

Ejemplo de jQuery hover()

$(document).ready(function(){
	$("#prueba").hover(function(){
		$("#prueba").css("background-color", "#000000");
		}, function(){
			$("#prueba").css("background-color", "#C3C3C3");
		});
});

Explicación el código superior:

  • Detectamos la presencia del ratón sobre el elemento con id = ‘prueba’, en este caso es el rectángulo gris.
  • Cuando el ratón se sitúa sobre el elemento cambiamos su color de fondo a negro –> #000000.
  • Cuando el ratón ya no está sobre el elemento cambiamos su color de fondo a gris –> #C3C3C3.

El código HTML del rectángulo es el siguiente:

<div id="prueba" style="height:200px; width:500px; background-color:#C3C3C3; padding:50px 50px 50px 50px;"></div>

 


¿Quieres el código fuente del proyecto
Uso de la funcion hover jQuery?

...por favor suscríbete gratuitamente para descargarlo

SUSCRÍBIRME

Compártelo...talvez alguién lo necesite!

Whatsapp Messenger Facebook Twitter
ó copia el link

Visitado 164 veces | Publicado hace 8 meses

Más códigos de programación en JQUERY.

Ver scripts de JQUERY

Aprende a crear aplicaciones móviles en Android con el curso Android desde cero

VER EL CURSO ANDROID DESDE CERO

Lo último que estamos programando en el curso: Android desde Cero

Realizar pruebas debug y generar el APK de la App Hotel

Debug y generar apk

© Todos los derechos reservados CODEA APLICACIONES | Comunidad de programación web y desarrollo de aplicaciones móviles | 2020