Eventos onMouseOver y onMouseOut en java script

Temas > Programacion > Java script - Java > Eventos onMouseOver y onMouseOut en java script

Julio(Admin)

Fecha de registro: 2011-01-21 21:33:50
Total temas creados: 456
Total mensajes enviados: 26

Fecha del Tema: 2013-04-07 19:48:49

Eventos onMouseOver y onMouseOut El evento onMouseOver se ejecuta cuando pasamos la flecha del mouse sobre un hipervínculo y el evento onMouseOut cuando la flecha abandona el mismo. Para probar estos eventos implementaremos una página que cambie el color de fondo del documento. Implementaremos una función que cambie el color con un valor que llegue como parámetro. Cuando retiramos la flecha del mouse volvemos a pintar de blanco el fondo del documento: <?php //esto no va <html> <head></head> <body> <script language="JavaScript"> function pintar(col) { document.bgColor=col; } </script> <a href="pagina1.html" onMouseOver="pintar(`#ff0000`)" onMouseOut="pintar(`#ffffff`)">Rojo</a> - <a href="pagina1.html" onMouseOver="pintar(`#00ff00`)" onMouseOut="pintar(`#ffffff`)">Verde</a> - <a href="pagina1.html" onMouseOver="pintar(`#0000ff`)" onMouseOut="pintar(`#ffffff`)">Azul</a> <br> <br> <br> <a href="pagina2.html">ver segundo problema</a> </body> </html> ?>//esto no va Las llamadas a las funciones las hacemos inicializando las propiedades onMouseOver y onMouseOut: <?php //esto no va <a href="pagina1.html" onMouseOver="pintar(`#ff0000`)" onMouseOut="pintar(`#ffffff`)">Rojo</a> ?>//esto no va La función `pintar` recibe el color e inicializa la propiedad bgColor del objeto document. <?php //esto no va function pintar(col) { document.bgColor=col; } ?>//esto no va El segundo problema pinta de color el interior de una casilla de una tabla y vuelve a su color original cuando salimos de la misma: <?php //esto no va <html> <head></head> <body> <script language="JavaScript"> function pintar(objeto,col) { objeto.bgColor=col; } </script> <table border="1"> <tr> <td onMouseOver="pintar(this,`#ff0000`)" onMouseOut="pintar(this,`#ffffff`)">rojo</td> <td onMouseOver="pintar(this,`#00ff00`)" onMouseOut="pintar(this,`#ffffff`)">verde</td> <td onMouseOver="pintar(this,`#0000ff`)" onMouseOut="pintar(this,`#ffffff`)">azul</td> </tr> </table> </body> </html> ?>//esto no va La lógica es bastante parecida a la del primer problema, pero en éste, le pasamos como parámetro a la función, la referencia a la casilla que queremos que se coloree (this): <?php //esto no va <td onMouseOver="pintar(this,`#ff0000`)" onMouseOut="pintar(this,`#ffffff`)">rojo</td> ?>//esto no va

Si quieres dejar un comentario registrate o inicia sesión pulsando aquí

¿Has olviado tu contraseña?
¿Todavia no te has registrado?
Pulsa aquí para registrate

Visitas: 1558652
Usuarios en linea: 1

Google

Calendario

Lun	Mar	Mie	Jue	Vie	Sab	Dom

1	2	3	4	5	6	7
8	9	10	11	12	13	14
15	16	17	18	19	20	21
22	23	24	25	26	27	28
29	30

Martes 16 de Abril 2024
Semana 16

Enlaces de interes

Todos los viernes a las 23:30 hs

Java script - Java

-Input type submit con evento onclick
-Maneras de salir de un iframe con java script
-Sintaxis de un list array en java
-Consumir un JSON desde PHP
-Producir JSON desde PHP
-Mostrar un tooltip con datos recuperados en jQuery
-Menu desplegable en jQuery
-Llamadas encadenadas de metodos del objeto jQuery
-Funcion ajax en jQuery
-JSON en jQuery
-Pasando datos por los metodos GET y POST en jQuery
-Ajax metodos ajaxStart y ajaxStop en jQuery
-Ajax metodo load en jQuery
-Iteracion por los elementos each en jQuery
-Efecto con el metodo toggle en jQuery
-Efecto con el metodo fadeTo en jQuery
-Efectos con los metodos fadeIn y fadeOut en jQuery
-Efectos con los metodos show y hide en jQuery
-Manipulacion de los elementos del DOM en jQuery
-Evento blur en jQuery
-Evento focus en jQuery
-Evento dblclick en jQuery
-Eventos mousedown y mouseup en jQuery
-Evento mousemove en jQuery
-Evento hover en jQuery
-Eventos mouseover y mouseout en jQuery
-Administracion de eventos con jQuery
-Metodos html y html valor en jQuery
-Metodos addClass y removeClass en jQuery
-Metodos attr y removeAttr en jQuery
-Metodos text, text valor en jQuery
-Seleccion de elementos con la clase CSS definida
-Seleccion de elementos utilizando el selector CSS
-Seleccion de elementos por el tipo de elementos jQ
-Seleccion de un elemento mediante el id jQuery
-Nueva manera de programar JavaScript con jQuery
-Que es el jQuery
-Archivo JavaScript externo
-Propiedad screen del objeto window en java script
-Propiedad location de objeto window en java script
-El objeto window en java script
-Eventos onFocus y onBlur en java script
-Control TEXTAREA en java script
-Control RADIO en java script
-Control CHECKBOX en java script
-Control SELECT en java script
-Control PASSWORD en java script
-Controles FORM, BUTTON y TEXT en java script
-Formularios y Eventos en java script
-Clase Math en java script
-Clase String en java script
-Clase Array en java script
-Clase Date en java script
-Programacion orientada a objetos en java script
-Funciones que retornan un valor en java script
-Funciones con parametros en java script
-Funciones en java script
-Estructura repetitiva for en java script
-Estructura repetitiva do while en java script
-Concepto de acumulador en java script
-Estructura repetitiva (while) en java script
-Operadores logicos or en las estructuras java s
-Operadores logicos (and) en las estructuras java s
-Estructuras condicionales anidadas en java script
-Estructuras condicionales compuesta en jaca script
-Estructuras condicionales simples en java script
-Estructuras secuenciales en java script
-Entrada de datos por teclado en java script
-Variables en java script
-Que es JavaScript
-Lectura y escritura de archivos en java
-Entrada y salida estandar en Java
-Programa para contar vocales de un fichero en java
-Convertidor de divisas en java
-Form con una ventana nueva
-Seleccionar un elemento html mediante su id

..............................................................................................................................................................................................................................................

Foro creado y diseñado para compartir conocimientos
Política de privacidad y Aviso legal Autor: Julio Tortosa (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