Temas > Programacion > Java script - Java > Eventos mousedown y mouseup en jQuery
Julio

Eventos mousedown y mouseup
El evento mousedown se dispara cuando presionamos
alguno de los botones del mouse y el evento mouseup 
cuando dejamos de presionar el botón.
Implementemos una página que contenga una tabla con 
una fila y dos columna, al presionar el botón del mouse 
dentro de una casilla de la tabla cambiar el color de
fondo de la misma por amarillo y cuando levantamos el 
dedo del mouse regresar a color blanco la casilla.
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>
 <table border="1">
 <tr>
 <td>1111111111</td><td>1111111111</td>
 </tr>
 </table>
 </body>
 </html>
?>//esto no va
funciones.js
<?php //esto no va
 var x;
 x=$(document);
 x.ready(inicializarEventos);
 function inicializarEventos()
 {
   var x;
   x=$("td");
   x.mousedown(presionaMouse);
   x.mouseup(sueltaMouse);
 }
 function presionaMouse()
 {
    $(this).css("background-color","#ff0");
 }
 function sueltaMouse()
 {
    $(this).css("background-color","#fff");
 }
?>//esto no va
Primero asociamos los eventos mousedown y mouseup 
a todos los elementos td del documento:
<?php //esto no va
   var x;
   x=$("td");
   x.mousedown(presionaMouse);
   x.mouseup(sueltaMouse);
?>//esto no va
Cuando se presiona algún botón del mouse dentro de 
una celda de la tabla se dispara la función:
<?php //esto no va
function presionaMouse()
{
   $(this).css("background-color","#ff0");
}
?>//esto no va
De forma similar cuando se suelta el botón del mouse 
se dispara la función:
<?php //esto no va
function sueltaMouse()
{
   $(this).css("background-color","#fff");
}
?>//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