63 lines
		
	
	
		
			2.5 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
			
		
		
	
	
			63 lines
		
	
	
		
			2.5 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
<html> 
 | 
						|
  <head> 
 | 
						|
    <title>Calculator</title> 
 | 
						|
    <link rel="stylesheet" type="text/css" href="css/calculator.css"/> 
 | 
						|
  </head> 
 | 
						|
 
 | 
						|
  <body> 
 | 
						|
    <div id="calculator"> 
 | 
						|
      <div id="display"> 
 | 
						|
        <div id="display_cell"> 
 | 
						|
          <div id="display_scroll"> 
 | 
						|
            <table id="display_grid"> 
 | 
						|
              <col id="display_gutter"/> 
 | 
						|
              <col id="display_main"/> 
 | 
						|
              <col id="display_other"/> 
 | 
						|
              <!-- the display lines go into this empty tbody --> 
 | 
						|
              <tbody id="display_grid_body"/> 
 | 
						|
            </table> 
 | 
						|
          </div> 
 | 
						|
        </div> 
 | 
						|
      </div> 
 | 
						|
      <div id="divide"> 
 | 
						|
        <div><button>+</button></div> 
 | 
						|
      </div> 
 | 
						|
      <div id="button_pad"> 
 | 
						|
        <table> 
 | 
						|
          <tbody> 
 | 
						|
            <tr> 
 | 
						|
              <td><button id="kp_7" class="pad_button">7</button></td> 
 | 
						|
              <td><button id="kp_8" class="pad_button">8</button></td> 
 | 
						|
              <td><button id="kp_9" class="pad_button">9</button></td> 
 | 
						|
              <td><button id="kp_div" class="pad_button round_pad_button">÷</button></td> 
 | 
						|
            </tr> 
 | 
						|
            <tr> 
 | 
						|
              <td><button id="kp_4" class="pad_button">4</button></td> 
 | 
						|
              <td><button id="kp_5" class="pad_button">5</button></td> 
 | 
						|
              <td><button id="kp_6" class="pad_button">6</button></td> 
 | 
						|
              <td><button id="kp_mul" class="pad_button round_pad_button">×</button></td> 
 | 
						|
            </tr> 
 | 
						|
            <tr> 
 | 
						|
              <td><button id="kp_1" class="pad_button">1</button></td> 
 | 
						|
              <td><button id="kp_2" class="pad_button">2</button></td> 
 | 
						|
              <td><button id="kp_3" class="pad_button">3</button></td> 
 | 
						|
              <td><button id="kp_sub" class="pad_button round_pad_button">−</button></td> 
 | 
						|
            </tr> 
 | 
						|
            <tr> 
 | 
						|
              <td><button id="kp_0" class="pad_button">0</button></td> 
 | 
						|
              <td><button id="kp_dot" class="pad_button round_pad_button">.</button></td> 
 | 
						|
              <td><button id="kp_eq" class="pad_button round_pad_button">=</button></td> 
 | 
						|
              <td><button id="kp_add" class="pad_button round_pad_button">+</button></td> 
 | 
						|
            </tr> 
 | 
						|
          </tbody> 
 | 
						|
        </table> 
 | 
						|
      </div> 
 | 
						|
    </div> 
 | 
						|
    <script type="text/javascript" src="js/calculator.js"></script> 
 | 
						|
    <script type="text/javascript"> 
 | 
						|
      var calculator = new Calculator();
 | 
						|
      window.addEventListener('load', calculator.init.bind(calculator), false);
 | 
						|
    </script> 
 | 
						|
  </body> 
 | 
						|
</html> 
 |