Calculadora con Javascript, Html y CSS desde Cero




En este video te muestro como hacer una calculadora básica desde cero completamente utilizando unicamente HTML para la estructura, CSS para un poco de estilo y por último Javascript para la funcionalidad de la calculadora.

Esta calculadora puede sumar, restar, multiplicar y dividir, asi como limpiar pantalla.

Puedes ver más a detalle:

Calculadora con Javascript: https://denisseestrada.com/calculadora-con-javascript/

Calculadora con jQuery: https://jonathanmelgoza.com/blog/calculadora-con-jquery/

Gracias por suscribirte!

—————————————————————————————————

Blog personal: https://jonathanmelgoza.com/blog/

—————————————————————————————————

Sigueme en mis redes sociales:

Youtube: https://www.youtube.com/c/jonathanmelgoza

Twitter: http://www.twitter.com/jonathanmelblog

Facebook: http://www.facebook.com/jonathanmelgozablog

LinkedIn: https://mx.linkedin.com/in/jonathanmelgoza

Pinterest: https://es.pinterest.com/jonathanmelgoza/

Instagram: https://www.instagram.com/jonathan__melgoza/

Original source


50 responses to “Calculadora con Javascript, Html y CSS desde Cero”

  1. Hola a todos, la calculadora me anda perfecto, lo hice en el editor Brackets, pero quiero enviar el documento por whatsapp y que abra en html completo cargando los códigos de CSS y JS, no se como entrelazarlos todos en un mismo archivo

  2. Omg este vídeo me ha solucionado la vida, tenía que hacer algo similar para clase y no sabía ni por donde empezar, si hacer un grid o una tabla o si usar botones o coordenadas. Muchísisimas gracias <3

  3. según yo, tengo todo en orden y bien escrito, pero con xampp, sólo me detecta lo escrito en el index.html, ya revicé y si tengo bien la unión al css y al js, si lo abro desde "ctrl + o" ahí sí se ve bien el css, y me funcionaba bien el js, después de terminar de agregar los eventos y empezar con las funciones, ya no se refleja en mi pantalla, incluso cambié el símbolo de multipilar (del "x" a "*" porque yo lo había empezado con "x", nomás porque sí) y eso ni se cambió en la pantalla, me sigue apareciendo el "x", no sé que pex:(
    si tengo la carpeta de la calculadora en htdocs

  4. Me quede atorado en los eventos , cuando le doy click a los botones , no me aparece nada en la pantalla de la calculadora, Alguien puede tneer una idea porque?

    Hice que Init me cargara sin ningun problema cuando hice la prueba del " Hola Mundo" pero ahora que estoy haciendo eventos para los botones y que aparezcan en la calculadora , es como si no tomara los numeros que puse .

  5. no me salio me salio distorcionado a los que les salga distorcionado pongan este codigo en estilo.css
    .calculadora{
    display:block;
    margin:0 auto;
    padding:20px;
    background-color: #DC4C46;
    width:350px;
    height:500px;
    border-radius: 25px;
    }

    .calculadora td button{
    display:block;
    width:60px;
    height:60px;
    font-size:25px;
    }

    #resultado{
    display: block;
    text-align:center;
    font-size: 40px;
    margin-bottom: 50px;
    width: 300px;
    height: 100px;
    line-height: 100px;
    background: #fff;
    border-radius: 25px;
    overflow-y: scroll;
    }

Leave a Reply