Cómo mover una imagen por X y Y en JavaScript (En 6 Pasos)

Por brian bennett
Cómo mover una imagen por X y Y en JavaScript (En 6 Pasos)
Martin Poole/Stockbyte/Getty Images

JavaScript puede modificar la información de las hojas de estilo en cascada en una página web, permitiendo que una imagen se mueva a distintas posiciones en una página, según la entrada de usuario. Un ejemplo de esto es una demostración de HTML, estilo y JavaScript que permite que una imagen se mueva por una página de forma aleatoria mientras el cursor del ratón está colocado sobre ella. Para conseguir esto, los atributos de posición de la imagen se modifican a medida que ocurren los eventos del paso del ratón.

Paso 1

Abre un nuevo documento en el editor de texto. Guarda el archivo como "moveimage.html".

Paso 2

Escribe el código de cabecera del documento.

Move Image

Paso 3

Escribe el código de estilo del documento.

Paso 4

Escribe el código JavaScript del documento.

Paso 5

Escribe el código del cuerpo del documento.

Paso 6

Abre este archivo en el navegador web. Mueve el puntero del ratón sobre la imagen, y se moverá a la nueva posición en la página.