WEB 230

Page 1 of 2 ©

Final Project

Building a Calculator


In this project you will write the JavaScript code to create a calculator. Good thing is that

everyone knows how the calculator works. It is a challenging project, give yourself lots of

time to complete it.

1. You are provided with an HTML, and CSS files.. Look at these files to understand

how to use them and modify them if needed based on your code. (Note: You can add

different selector (id, class) in HTML ONLY and cannot make any changes to CSS.)

Create your own .js file. All your work will be done in JS file.

2. Connect files and this is what you should see. All files must have your name in the

file’s name. You are ready to start.

3. Apply these changes :

a. Change the background colour of operation buttons (*, /, +, -), make each

button a different colour ( your choice).

b. Change the font colour for all number buttons (include decimal “.” button, to


c. Change the background colour of clear “C” button, to black. Also the font colour

to white.

4. Add three Buttons before “C” (clear) button as follow:

a. MS -- Memory Store

b. MC – Memory Clear

c. MR – Memory Restore

All three buttons must have grey background and white font.

After you apply the changes(with your own colour selection), you should see

something like this:

WEB 230

Page 2 of 2 © St. Clair College of Applied Arts and Technology

5. Record any clicking of buttons and display its value on the screen.

Suggested steps: (Note: You can come up with your own solution)

a. Create variables that will store targeted DOM elements, input/outputs

b. Add an event listener to retrieve data from all buttons when they are clicked.

The handler, function(event) can be used to display the value of the button

(number or operation) on the screen. You can use [login to view URL]

to return the value and it should be stored as a new variable added to screen


6. Perform calculations (*, /, +, -) when clicking on the equal “=” button,

Suggested steps:

a. Add an event listener for the equal button. When you click the button, the

handler function(event) can be used to calculate the expression using

eval([login to view URL]) method. Assign the answer that you obtain to the screen

value. (Note: eval() is a function/method that evaluates expressions. Like:


7. Display a message such as “Please Enter a Value”, when clicking the equal “=” button

and nothing is displayed on the screen.

8. Make the memory functional; storing, clearing and retrieving data.

Suggested steps:

a. Add event listeners for:

i. MSà Store the data from screen to memory;

ii. MC à clear the data in the memory;

iii. MR à Recall the memory value to screen.

9. Clear data in screen by clicking on “C” button.

10. Text appearing on the calculator screen must be aligned to the right.

11. When the mouse hovers over a button, change the background colour of the button.

(your choice of colour). Ensure the colour changes back when the mouse cursor is


The mark for this project is 25% of your mark. Partial marks will be given. 10% of mark will

be based on variable unique naming and proper code formatting. Identical projects will be

marked “0”. There is no late submission. Zip all files together in one.

WEB 230: JavaScript 1, Winter 21

Taidot: Koodaus, Ohjelmointi, Java

Näytä lisää: final project report scientific calculator application, write final project mba, flex project scientific calculator javascript, project report calculator javascript language, javascript perl final project, create tables relationships final project, program for calculator in javascript, calculator in javascript, final project report in freelancer, how to write a good articel and sell it, project manager role in building a nursing home project, entrepreneur personality final project in pakistan, how to create a mortgage calculator in javascript, how to create spring mvc project using maven in eclipse step by step, mini project on scientific calculator in c++, project report on scientific calculator in c++ pdf, write a program for scientific calculator in c++, how to make calculator in javascript, javascript final project ideas, create a cgpa calculator in web browser using html css and javascript

Tietoa työnantajasta:
( 0 arvostelua ) Toronto, Canada

Projektin tunnus: #30991805

Myönnetty käyttäjälle:


Hello i can handle this type of job for [login to view URL] free to message me. i will do my best in job for sure

$28 CAD 1 päivässä
(0 Arvostelua)

11 freelanceria on tarjonnut keskimäärin $47 tähän työhön


Hello sir, I have checked your project(javascript) requirements. We are one of the very good programming team on freelancer. Awarded "preferred freelancer badge" by Freelancer.com We have more than 127+ Client feed Lisää

$30 CAD 32 päivässä
(3 arvostelua)

Hi, how do you do? I am an expert on JavaScript. I have majored in PHP-CodeIgniter, Laravel, Python-Django, jQuery-Ajax, C++/C, C#, Java, Python. I have enough skills and rich experiences in this field over 9 years. I Lisää

$28 CAD 7 päivässä
(1 arvostelu)

Hi, Dear! I have a full experience of 7 years in HTML, JS and CSS... I have read your requirement carefully and I am interested in this project. If you`ll choose me, I am confident to provide you best solution that co Lisää

$25 CAD 2 päivässä
(1 arvostelu)

✨✔⭐⭐Dear Client⭐⭐✔✨ !! Thanks for sharing a clear requirement and I am really excited to bid you that I would be A suitable guy for you. I have been MERN(Mongodb, Express, React, Node) developer for 6+ years and I am r Lisää

$30 CAD 2 päivässä
(0 arvostelua)

Hello, there? I am appropriate to your description. I have rich experience with the similar projects over 6 years. I have small reviews but i can assure you that i will finish this project with high quality on time. Th Lisää

$25 CAD 1 päivässä
(0 arvostelua)

Hi I help you to create the calculator in javaScript >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>

$30 CAD 5 päivässä
(1 arvostelu)

⭐⭐⭐⭐⭐ Algorithm Expert ⭐⭐⭐⭐⭐ Dear sir! I am very familiar with algorithm & data structure using c/c++/c#/java/python language. I've checked just your attached project and I am very interested in your project. When do Lisää

$100 CAD 1 päivässä
(0 arvostelua)

Hi, there Thanks for your job suggestion. As a experienced and skillful full-stack web developer, I feel happy to suggest you my proposal on this project. I have checked your project description very carefully with gr Lisää

$100 CAD 2 päivässä
(0 arvostelua)

Hi I am ready to start your project immediately. If you award me, you will get the wonderful results. Best regards

$90 CAD 3 päivässä
(0 arvostelua)

I have working knowledge in java j2ee and web concepts.. And Ive done project using javascript, HTML and css. My project is jsp is based calculator... I think I can do this definetly

$28 CAD 7 päivässä
(0 arvostelua)