Calcolatrice JavaScript by @Codewith.it - Codewith.it

#main, .loader-cont { display: none; } JavaScript disabilitato.
Non puoi usare Codewith.it senza JavaScript.

References

animation-directionProprietà CSS per definire la direzione di esecuzione di un'animazione
loopL'attributo loop è usato per la riproduzione continua dei contenuti video e audio
<tbody>Definisce il contenuto principale di una tabella.
<option>Serve ad inserire una voce in un menu di selezione.
<html>Tag primario di un documento HTML
<h6>Titolo di intestazione di sesto livello

Users

Log in to search for users

Explore

Find inspiration

pag. 5 progetto inf

Copia testo in appunti

HTML

CSS

JS

terminal console

feedback

add_box New

cookie Policy

Privacy information and cookies

We use cookies or technologies for technical purposes and, with your consent, also for other purposes as specified in the cookie policy. Refusal of consent may make some functions unavailable. Read more about the privacy policy

Click on “Agree” to confirm.

    <style>
      * {
        margin:0;
        padding:0px;
      }
      #calc input {
        width:40px;
        height:40px;
        margin:1px;
        font-size:15px;
        border:none;
      }
      #calc input:hover{
        background-color:#ccc;
      }
      #calc input:active{
        background-color:#aaa;
      }
      #calcolatrice{
        background-color:#eee;
        width:fit-content;
        padding:10px 5px;
        box-shadow:1px 1px 7px #999;
        margin:10px;
      }
      .area {
        width:166px;
        height:30px;
        padding:2px;
        text-align:right;
        font-size:20px
      }
    </style>
    <div id="calcolatrice">
      <form name="form">
        <input class="area" name="area" value="" placeholder="0">
        <table id="calc">
          <tr>
            <td><input type="button" value="C" onclick="reset()"></td>
            <td><input type="button" value="<" onclick="cancella();"></td>
            <td><input type="button" value="/" onclick="dig('/');"></td>
            <td><input type="button" value="x" onclick="dig('*');"></td>
          </tr>       
          <tr>
            <td><input type="button" value="7" onclick="dig(7);"></td>
            <td><input type="button" value="8" onclick="dig(8);"></td>
            <td><input type="button" value="9" onclick="dig(9);"></td>
            <td><input type="button" value="-" onclick="dig('-');"></td>
          </tr>      
          <tr>
            <td><input type="button" value="4" onclick="dig(4);"></td>
            <td><input type="button" value="5" onclick="dig(5);"></td>
            <td><input type="button" value="6" onclick="dig(6);"></td>
            <td><input type="button" value="+" onclick="dig('+');"></td>
          </tr>      
          <tr>
            <td><input type="button" value="1" onclick="dig(1);"></td>
            <td><input type="button" value="2" onclick="dig(2);"></td>
            <td><input type="button" value="3" onclick="dig(3);"></td>
            <td rowspan="2"><input style="height:84px" type="button" value="=" onclick="somma();"></td>
          </tr>  
          <tr>
            <td><input type="button" value="0" onclick="dig(0);" ></td>
            <td><input type="button" value="00" onclick="dig('00');"></td>
            <td><input type="button" value=","onclick="dig('.');"></td>
          </tr>  
        </table>
      </form>
    </div>
        <script>
      function dig(n){
        document.form.area.value = document.form.area.value+n
      }
      function somma() {
        var c = document.form.area.value;
        if (c){
          document.form.area.value = eval(c);
        }
      }

      function reset() {
        document.form.area.value = '';
      }

      function cancella() {
        var a = document.form.area.value;
        document.form.area.value = a.substring(0, a.length-1);
      }
    </script>