CARLOSGINER / Magic_8_ball

App that recreates the magic eight ball game, using vanilla JavaScript, CSS and HTML.

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

BOLA 🎱 MAGICA / Visitar pagina aqui!


App que recrea el juego de Bola 8 Magica.

AUTOR

Carlos Giner

TECNOLOGIAS USADAS

  • HTML
  • CSS
  • JavaScript

COMO FUNCIONA

El programa usa la propiedad onclick del elemento button, para ejecutar la funcion de validación condicional evaluateInput(), para no dejar input de preguntas vacío. Luego, si hay texto dentro del input, ejecuta la funcion principal rotateBall() , que consiste en generar un numero aleatorio del 0 al 10, mediante los metodos del objeto Math y relacionarlo con alguna respuesta predeterminada, definidas usando la declaración switch. Para el efecto de giro de la bola, usé una imagen en forma de cinta alargada, previamente diseñada para este propósito( ver en carpeta img). Luego valiéndome de la propiedad Overflow: Hidden, logré que solo se viera el area redonda del div. Después con JavaScript, y la funcion setInterval(), se puede ir rodando la imagen un numero de pixeles determinado hacia la izquierda, lo que logra el efecto.


Carlos Giner © copyright 2021

About

App that recreates the magic eight ball game, using vanilla JavaScript, CSS and HTML.


Languages

Language:JavaScript 49.3%Language:CSS 37.0%Language:HTML 13.7%