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
      1
234567 8
9101112131415
16171819202122
23242526272829
30      

Domingo 8 de Septiembre 2024
Semana 36

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