Home arrow HTML arrow Adding Scientific Functions to a Web Page Calculator
HTML

Adding Scientific Functions to a Web Page Calculator


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.

Author Info:
By: Chrysanthus Forcha
Rating: 5 stars5 stars5 stars5 stars5 stars / 2
April 08, 2009
TABLE OF CONTENTS:
  1. · Adding Scientific Functions to a Web Page Calculator
  2. · Coding Summary
  3. · Details of the Scientific Function
  4. · The Global Variables

print this article
SEARCH DEVARTICLES

TOOLS YOU CAN USE

advertisement
Adding Scientific Functions to a Web Page Calculator
(Page 1 of 4 )

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.


blog comments powered by Disqus
HTML ARTICLES

- HTML5 Boilerplate: Working with jQuery and M...
- HTML5 Boilerplate Introduction
- New API Platform for HTML5
- BBC Adopts HTML 5, Mozilla Addresses Issues
- Advanced Sticky Footers in HTML and CSS
- HTML and CSS Sticky Footers
- Strategy Analytics Predicts HTML5 Phones to ...
- HTML5 Guidelines for Web Developers
- Learning HTML5 Game Programming
- More Engaging CSS3 and HTML Background Effec...
- Engaging HTML and CSS3 Background Effects
- More Web Columns with CSS3 and HTML
- Columns with CSS3 and HTML
- Creating Inline-Block HTML Elements with CSS
- Drag and Drop in HTML5: Parsing Local Files

Dev Articles Forums 
 RSS  Articles
 RSS  Forums
 RSS  All Feeds
Weekly Newsletter
 
Developer Updates  
Free Website Content 
Contact Us 
Site Map 
Privacy Policy 
Support 



© 2003-2012 by Developer Shed. All rights reserved. DS Cluster 3 - Follow our Sitemap
Popular Web Development Topics
All Web Development Tutorials