Adding Scientific Functions to a Web Page Calculator
(Page 1 of 4 )
In this last part of our six-part series, we shall talk about adding scientific functions to our web page calculator, and then conclude. Scientific functions refer to functions like sin(?), cos(?), tan(?), and log(x). The process is not as difficult as you think. The JavaScript interpreter incorporated into many browsers has some built-in scientific functions. It has most of the functions we shall use. However, it does not have some of the functions we shall use. We shall have to code the pair of functions that JavaScript does not have.
The layout
This is the picture of our calculator with buttons for scientific functions:

Fig. 6.1 Scientific Calculator
I have included 10 scientific functions. A physical calculator has more. When you complete this series, you will be able to add the other functions. Each button for a scientific function has the identification or the abbreviated name of the particular function.
There are two rows of the scientific buttons. These rows are above the standard buttons. This is the HTML code for the scientific buttons in the calculator DIV element:
<button type="button" class="CalcBut" id="BSI" onclick="scienceFn('BSI')">sin</button><button type="button" class="CalcBut" id="BCO" onclick="scienceFn('BCO')">cos</button><button type="button" class="CalcBut" id="BTA" onclick="scienceFn('BTA')">tan</button><button type="button" class="CalcBut" id="BLN" onclick="scienceFn('BLN')">ln</button><button type="button" class="CalcBut" id="BLO" onclick="scienceFn('BLO')">log</button><br />
<button type="button" class="CalcBut" id="BYX" onclick="operator('BYX')">y<sup>x</sup></button><button type="button" class="CalcBut" id="BSQ" onclick="scienceFn('BSQ')">sqrt</button><button type="button" class="CalcBut" id="BX2" onclick="scienceFn('BX2')">x<sup>2</sup></button><button type="button" class="CalcBut" id="BEX" onclick="scienceFn('BEX')">e<sup>x</sup></button><button type="button" class="CalcBut" id="BRO" onclick="scienceFn('BRO')">Rnd</button><br />
These tags are just above the tags for the standard buttons.
Next: Coding Summary >>
More HTML Articles
More By Chrysanthus Forcha