Calculator Javascript

This is a code to create calculator with javascrip.
code for test.html :
<html>
  <head>
    <script type="text/javascript" src="12100917-jv.js"></script>
    <script type="text/javascript">
      $(document).ready(function(){
        $(".flip").click(function(){
          $(".pesan").slideToggle("slow");
        });
      });
    </script>
    <style type="text/css">
      div.pesan {
        height:120px;
        display:none;
      }

      div.pesan, p.flip {
        margin: 0px;
        padding: 5px;
        text-align: center;
        background: lightblue;
        border: 1px solid black;
        cursor: pointer;
      }
    </style>
  </head>
    <body>
    <html>
    <head>
    <title>RESPONSI WEB STATIS</title>
    <SCRIPT LANGUAGE="JavaScript">
function addChar(input, character) {
    if(input.value == null || input.value == "0")
        input.value = character
    else
        input.value += character
}
function deleteChar(input) {
    input.value = input.value.substring(0, input.value.length - 1)
}
function changeSign(input) {
    if(input.value.substring(0, 1) == "-")
        input.value = input.value.substring(1, input.value.length)
    else
        input.value = "-" + input.value
}
function compute(form) {
    form.display.value = eval(form.display.value)
}
function square(form) {
    form.display.value = eval(form.display.value) * eval(form.display.value)
}
function checkNum(str) {
    for (var i = 0; i < str.length; i++) {
        var ch = str.substring(i, i+1)
        if (ch < "0" || ch > "9") {
            if (ch != "/" && ch != "*" && ch != "+" && ch != "-" && ch != "."
                && ch != "(" && ch!= ")") {
                alert("invalid entry!")
                return false
                }
            }
        }
        return true
}
</SCRIPT>
<style type="text/css">
body {
   
    background-image: url(Blue-Planet.jpg);
}
    h1 {
    color: #2f7cad;
    font-size: 30;
    font-family:"Edwardian Script ITC";
    text-align:left;
    }
   
    h2 {
    color: #5247bd;
    font-size: 40;
    font-family:"Courier New";
    text-align:center;
    }
   
    </style>
<body onload=kosong()>
    <h1>&nbsp;</h1>
    <FORM NAME="sci-calc">
<TABLE border="2" align="center" CELLPADDING="2" CELLSPACING="5" bordercolor="#2f9cabd">
<TR>
<TD COLSPAN="6" ALIGN="center"><INPUT NAME="display" VALUE="0" SIZE="35" MAXLENGTH="30"></TD>
</TR>
<TR>
<TD ALIGN="center"><INPUT TYPE="button" VALUE="  1  " ONCLICK="addChar(this.form.display, '1')"></TD>
<TD ALIGN="center"><INPUT TYPE="button" VALUE="  2  " ONCLICK="addChar(this.form.display, '2')"></TD>
<TD ALIGN="center"><INPUT TYPE="button" VALUE="  3  " ONCLICK="addChar(this.form.display, '3')"></TD>
<TD ALIGN="center"><INPUT TYPE="button" VALUE="   /   " ONCLICK="addChar(this.form.display, '/')"></TD>
</TR>
<TR>

<TD ALIGN="center"><INPUT TYPE="button" VALUE="  4  " ONCLICK="addChar(this.form.display, '4')"></TD>
<TD ALIGN="center"><INPUT TYPE="button" VALUE="  5  " ONCLICK="addChar(this.form.display, '5')"></TD>
<TD ALIGN="center"><INPUT TYPE="button" VALUE="  6  " ONCLICK="addChar(this.form.display, '6')"></TD>
<TD ALIGN="center"><INPUT TYPE="button" VALUE="   *   " ONCLICK="addChar(this.form.display, '*')"></TD>
</TR>
<TR>

<TD ALIGN="center"><INPUT TYPE="button" VALUE="  7  " ONCLICK="addChar(this.form.display, '7')"></TD>
<TD ALIGN="center"><INPUT TYPE="button" VALUE="  8  " ONCLICK="addChar(this.form.display, '8')"></TD>
<TD ALIGN="center"><INPUT TYPE="button" VALUE="  9  " ONCLICK="addChar(this.form.display, '9')"></TD>
<TD ALIGN="center"><INPUT TYPE="button" VALUE="   -   " ONCLICK="addChar(this.form.display, '-')"></TD>
</TR>
<TR>

<TD ALIGN="center"><INPUT TYPE="button" VALUE="  0  " ONCLICK="addChar(this.form.display, '0')"></TD>
<TD ALIGN="center"><INPUT TYPE="button" VALUE="   .  " ONCLICK="addChar(this.form.display, '.')"></TD>
<TD ALIGN="center"><INPUT TYPE="button" VALUE="=" NAME="enter" ONCLICK="if (checkNum(this.form.display.value)) { compute(this.form) }"></TD>
<TD ALIGN="center"><INPUT TYPE="button" VALUE="   +  " ONCLICK="addChar(this.form.display, '+')"></TD>
</TR>

<TR>
<TD ALIGN="center"COLSPAN="2"><INPUT TYPE="button" VALUE="reset" ONCLICK="this.form.display.value = 0 "></TD>
<TD ALIGN="center" COLSPAN="2"><INPUT TYPE="button" VALUE="backspace" ONCLICK="deleteChar(this.form.display)"></TD>
</TR>
</TABLE>
</FORM>
</body>
</html>

      <div class="pesan">
      <p>Sukses bukanlah kunci kebahagiaan. <br> Kebahagiaanlah kunci kesuksesan.</p>
      <p>Jika senantiasa melakukan segala sesuatu dengan penuh cinta, <br> maka Anda akan sukses.</p>
      </div>
      <p class="flip"><blink><b><marquee onMouseOver="this.stop();" onMouseOut="this.start();" scrolldelay="0" scrollamount="4">Klik untuk tampilkan pesan NIM : 12100917</marquee></b></blink></p>
    </body>
</html>



download javascript here.
 
Previous
Next Post »