jonathan-perez / clave1

Repositorio para la clave 1 de las pistas de la yincana de BilboStack 2024

Proyecto "¿Qué eres? ¡EN MAYUSCULAS!"

Descripción

Este repositorio contiene el código fuente y los archivos necesarios para un proyecto web interactivo y visualmente atractivo llamado "¿Qué eres? ¡EN MAYUSCULAS!". La aplicación presenta una animación de texto, un efecto de cambio de colores y un fondo de caracteres móviles. Además, se incluye un componente de audio que se reproduce cuando el usuario interactúa con la pantalla.

Contenido del Repositorio

• index.html: Este archivo define la estructura HTML de la página web. Contiene enlaces a hojas de estilo externas, bibliotecas de animación y el archivo JavaScript principal.

• script.js: Este archivo contiene el código JavaScript que controla la reproducción del audio y la animación del texto.

• style.css: Este archivo proporciona estilos para la presentación visual de la página web.

• galeria/quick-mechanical-keyboard-using-enter-14390.mp3: Archivo de audio utilizado en la aplicación.

Cómo Ejecutar la Aplicación

1. Abre el archivo index.html en un navegador web compatible con HTML5 y JavaScript.
2. Al cargar la página, se mostrará una alerta indicando que se debe hacer clic en cualquier lugar de la pantalla para reproducir el audio.
3. Después de cerrar la alerta, haz clic en cualquier lugar de la pantalla para activar la reproducción del audio y disfrutar de la animación.

Detalles Técnicos

• La animación del texto utiliza la biblioteca animate.css para lograr efectos visuales llamativos.

• El fondo de la página está compuesto por caracteres en movimiento que forman una matriz de texto.

• La animación de movimiento del elemento con la clase .desplazamiento es lograda mediante keyframes definidos en CSS.

• La aplicación está diseñada para ser receptiva y ofrece estilos específicos para dispositivos móviles.

Esperamos que disfrutes interactuando con esta aplicación web creativa. ¡Diviértete explorando las animaciones y el efecto de sonido!