Tecnología

Inicio

Cómo crear un Mouseover

Cómo crear un Mouseover


Navegadores muestran automáticamente los enlaces de manera diferente del texto normal. De forma predeterminada, el texto de un enlace aparece en un color diferente, y al colocar el cursor del ratón sobre el enlace, se convierte subrayado. Editar el código de un enlace para realizar otras acciones, así cuando un cursor resalta. Por ejemplo, si el enlace contiene una imagen en lugar de texto, establecer una segunda imagen para ocupar su lugar. También puede cambiar otras propiedades de la imagen o asignar un nuevo texto que aparezca, ya sea como un mensaje de información sobre herramientas (o pop-up) o como un cuadro de diálogo.

Instrucciones

1 Abra la página Web utilizando un editor HTML, como Adobe Dreamweaver o un editor de texto como el Bloc de notas.

2 Coloque el cursor dentro de la etiqueta de apertura del enlace. Por ejemplo, imaginemos que el código para el enlace es:

<a href="blog.html"> <img y ">".

3 Insertar código para las acciones cuando el ratón entre y salga el enlace de la siguiente manera:

onmouseover =

onmouseout =

4 Añadir un código para cada acción, especificando el resultado. Por ejemplo, si desea que la imagen para cambiar a "blogText2.png" cuando el ratón pasa sobre ella:

onmouseover = "document.changingImage.src = 'blogText2.png'"

onmouseout = "document.changingImage.src = 'blogText.png'"

5 Añada un nombre para la etiqueta del objeto asociado para que la página sabe qué hay que cambiar. Con este ejemplo, editar la etiqueta de la imagen, añadiendo un nombre:

<Img src = nombre changineImage = "blogText.png">