Últimos Temas de: vanel622

Tengo qeu hacer funcionar uan calculadora con un HTML que me dan no puedo modificarlo ni el CSS pero tengo qeu ahcer cierto tipos de cosas con el JS:
1. Desarrolla la funcionalidad de la calculadora utilizando el patrón módulo, es decir que todo el código debe estar englobado en un objeto llamado Calculadora. Utiliza un método de inicialización que se encargue de ejecutar todas las otras funciones que se deben iniciar con la ejecución del programa.
2. Crea los métodos que consideres necesarios para hacer que la tecla presionada reduzca su tamaño y vuelva a su forma original al soltarla.
3. Para efectos de este proyecto sólo realizaremos las 4 operaciones básicas: suma, resta, multiplicación y división. El botón que indica raíz cuadrada sólo hace parte del diseño general de la calculadora y no es necesario que lo implementes.

Les dejo el codigo HTML

Código

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width,user-scalable=no">
  <link href="https://fonts.googleapis.com/css?family=Poppins" rel="stylesheet">
  <link href="https://fonts.googleapis.com/css?family=Luckiest+Guy" rel="stylesheet">
  <title>Calculadora</title>
  <link rel="stylesheet" href="css/estilos.css">
</head>
<body>
  <div class="fondo">
    <div class="titulo-container">
      <h1>¡No pierdas <span>la cuenta!</span></h1>
    </div>
 
    <div class="notas-container">
      <h2>Tus apuntes...</h2>
      <textarea class="nota-input" placeholder="Escribe aquí..."></textarea>
    </div>
 
    <div id="calculadoraFondo">
      <div class="pantalla">
        <span id="display">0</span>
      </div>
 
      <div class="teclado">
        <img src="image/ON.png" alt="On" class="tecla" id="on"/>
        <img src="image/sign.png" alt="signo" class="tecla" id="sign"/>
        <img src="image/raiz.png" alt="raiz" class="tecla" id="raiz"/>
        <img src="image/dividido.png" alt="dividido" class="tecla divide" id="dividido"/>
 
        <img src="image/7.png" alt="7" class="tecla" id="7" />
        <img src="image/8.png" alt="8" class="tecla" id="8"/>
        <img src="image/9.png" alt="9" class="tecla" id="9"/>
        <img src="image/por.png" alt="por" class="tecla multiplica" id="por"/>
 
        <img src="image/4.png" alt="4" class="tecla" id="4"/>
        <img src="image/5.png" alt="5" class="tecla" id="5"/>
        <img src="image/6.png" alt="6" class="tecla" id="6"/>
        <img src="image/menos.png" alt="menos" class="tecla resta" id="menos"/>
 
        <div class="row">
          <div class="col1">
            <img src="image/1.png" alt="1" class="tecla" id="1"/>
            <img src="image/2.png" alt="2" class="tecla" id="2"/>
            <img src="image/3.png" alt="3" class="tecla" id="3"/>
 
            <img src="image/0.png" alt="0" class="tecla" id="0"/>
            <img src="image/punto.png" alt="punto" class="tecla" id="punto"/>
            <img src="image/igual.png" alt="igual" class="tecla" id="igual"/>
          </div>
          <div class="col2">
            <img src="image/mas.png" alt="mas" class="tecla suma" id="mas"/>
          </div>
 
        </div>
      </div>
    </div>
 
 
 
    <div class="container-libreta">
      <div class="libreta">
        <div class="contenido-ingresos">
          <h3>Ingresos</h3>
          <ul>
            <li><span>Salario: </span>$1300.00</li>
            <li><span>Bonificación: </span>$200.00</li>
          </ul>
        </div>
        <div class="contenido-egresos">
          <h3>Egresos</h3>
          <ul>
            <li><span>Renta: </span>$300.00</li>
            <li><span>Alimentos: </span>$250.00</li>
            <li><span>Restaurantes: </span>$120.00</li>
            <li><span>Automóvil: </span>$100.00</li>
          </ul>
        </div>
      </div>
    </div>
 
 
  </div>
  <script src="js/app.js"></script>
</body>
</html>

· Los códigos deben ir en etiquetas GeSHi
· Los temas van en su respectivo subforo, java no está relacionado con javascript
· El titulo debe ser descriptivo
>aquí las reglas del foro
-Engel Lex