Convertirás tu "pesé" en una electro-varita sembradora del caos en una página que te proveemos dentro del repositorio.
Mientras mueves el ratón y haces click sobre las cosas, irá haciendo cambios a su paso.
-
HTML
-
CSS
-
Javascript
-
DOM API
En este repositorio tienes descargada y "aligerada" un post del conocido blog "Coding Horror".
Todo está preparado para que puedas escribir en el archivo scripts.js
Todo ha de hacerse mediante Javascript.
-
Evita el comportamiento por defecto al hacer click. Por ejemplo, si hago click sobre un enlace, este no me llevará a otra página.
-
Al hacer click sobre un elemento van a ocurrir varias cosas. Todo depende del tipo de elemento:
2.1 Imágenes: Cambia la imagen por uno de los
gif
que tienes en la carpeta assets con el nombre magic-*.2.2 Párrafos: Cambia el color del texto y el de fondo por uno cualquiera.
2.3 Bloques de
article
osection
: Cambia el color de fondo. -
Cuando el cursor esté sobre alguno de los siguientes elementos, seguir las instrucciones siguientes, y devolver dicho elemento a su estado original cuando salga el cursor.
3.1 Imágenes: Cambia la imagen por el gif
abracadabra.gif
.3.2 Párrafos: Cambia el color del texto y el de fondo por uno cualquiera.
3.3 Bloques de
article
osection
: Color de fondo distinto al de párrafo.
Premium
-
Crea una función de nombre
getRandom
que acepte un array con valores y devuelva uno de ellos de manera aleatoria.const colors = ['red', 'blue', 'green'] const getRandom = (array) => { /* código misterioso */ } console.log(getRandom(colors)) // imprime 'red', 'blue' o 'green'
-
Utiliza la función creada
getRandom
para utilizar colores aleatorios de una paleta que hayas escogido de coolors.co en los apartados anteriores. -
Utiliza la función creada
getRandom
para utilizar gifs aleatorios en los apartados anteriores.