Temas > Programacion > Java script - Java > Evento hover en jQuery
Julio

Evento hover
jQuery no solo mapea los eventos del DOM sino 
que provee otros que combinan estos.
Como decíamos es común utilizar los eventos 
mouseover y mouseout en común, por eso en 
jQuery existe un evento llamado hover que tiene 
dos parámetros:
$(elemento).hover([función de ingreso del mouse],
[función de salida del mouse]).
Es decir que al evento hover asociamos dos funciones, 
la primera se ejecuta cuando ingresamos la flecha del 
mouse dentro del elemento y la segunda cuando 
retiramos la flecha del mouse.
Confeccionaremos el mismo problema del concepto 
que vimos los eventos mouseover y mouseout.
Implementaremos una página que contenga tres 
hiper vínculos, cuando ingrese la flecha del mouse al 
hipervínculo cambiaremos el color de fondo, retornando 
el color original cuando retiramos la flecha del elemento.
pagina1.html
<?php //esto no va
 <html>
 <head>
 <title>Problema</title>
 <script type="text/javascript" src="../jquery.js"></script>
 <script type="text/javascript" src="funciones.js"></script>
 </head>
 <body>
 <a href="http://www.lavoz.com.ar">La Voz del Interior</a>
 <br>
 <a href="http://www.lanacion.com.ar">La nación</a>
 <br>
 <a href="http://www.clarin.com.ar">El clarín</a>
 <br>
 </body>
 </html>
?>//esto no va
funciones.js
<?php //esto no va
 var x;
 x=$(document);
 x.ready(inicializarEventos);
 function inicializarEventos()
 {
    var x;
    x=$("a");
    x.hover(entraMouse,saleMouse);
 }
 function entraMouse()
 {
    $(this).css("background-color","#ff0");
 }
 function saleMouse()
 {
    $(this).css("background-color","#fff");
 }
?>//esto no va
Utilizamos solamente el evento hover para cambiar 
el color de fondo del ancla cuando se ingresa la flecha 
del mouse y retornarla al color original cuando se sale:
<?php //esto no va
   var x;
   x=$("a");
   x.hover(entraMouse,saleMouse);
?>//esto no va













¿Has olviado tu contraseña?

Pulsa aquí para registrate




Google






LunMarMieJueVieSabDom
    123
45678910
11121314151617
181920 21222324
252627282930 

Jueves 21 de Noviembre 2024
Semana 47

..............................................................................................................................................................................................................................................
(Contacto)..
Esta web utiliza cookies para obtener datos estadísticos de la navegación de sus usuarios. Política de privacidad y Aviso legal