El hover() es un método incorporado en jQuery que se usa para especificar dos funciones para comenzar cuando el puntero del mouse se mueve sobre el elemento seleccionado.
Sintaxis:
$(selector).hover(Function_in, Function_out);
Aquí selector es el elemento seleccionado.
Parámetro: Acepta dos parámetros que se especifican a continuación:
- Function_in: especifica la función que se ejecutará cuando se produzca el evento de introducción del ratón.
- Function_out: es opcional y especifica la función que se ejecutará cuando se produzca el evento de abandono del ratón.
Valor devuelto: Devuelve el efecto de color de fondo con el elemento seleccionado.
Código #1:
<html>
<head>
<script src=
"https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js">
</script>
<script>
<!-- jQuery code to show the working of hover() method -->
$(document).ready(function() {
$("p").hover(function() {
$(this).css("background-color", "green");
}, function() {
$(this).css("background-color", "yellow");
});
});
</script>
<style>
p {
width: 55%;
height: 80px;
padding: 20px;
margin: 10px;
border: 2px solid green;
font-size: 50px;
}
</style>
</head>
<body>
<!--move the mouse in and out over this paragraph
and background color will change-->
<p>GeeksforGeeks !</p>
</body>
</html>
Salida:
Antes de mover el puntero del mouse sobre el párrafo- 
Después de mover el puntero del mouse sobre el párrafo- 
Después de mover el puntero del mouse fuera del párrafo-
Publicación traducida automáticamente
Artículo escrito por kundankumarjha y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA