https://github.com/charakamihiranga/calculator
A simple and user-friendly calculator web application that supports basic arithmetic operations and complex calculations
https://github.com/charakamihiranga/calculator
calculator-javascript css html javascript
Last synced: 7 months ago
JSON representation
A simple and user-friendly calculator web application that supports basic arithmetic operations and complex calculations
- Host: GitHub
- URL: https://github.com/charakamihiranga/calculator
- Owner: charakamihiranga
- License: mit
- Created: 2024-06-13T09:18:11.000Z (almost 2 years ago)
- Default Branch: main
- Last Pushed: 2024-08-13T08:38:57.000Z (over 1 year ago)
- Last Synced: 2025-02-16T10:30:53.032Z (about 1 year ago)
- Topics: calculator-javascript, css, html, javascript
- Language: JavaScript
- Homepage:
- Size: 7.81 KB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Calculator
A simple and user-friendly calculator web application that supports basic arithmetic operations and complex calculations. The calculator can be operated using both mouse clicks and keyboard inputs.
## Features
- **Basic Arithmetic Operations**: Addition, Subtraction, Multiplication, and Division.
- **Parentheses Support**: Handle complex expressions using parentheses.
- **Percentage Calculations**: Support for percentage operations.
- **Clear (AC) and Backspace Functionalities**: Easily clear input or delete the last character.
- **Real-Time Input Display Formatting**: Clean and user-friendly input display.
- **Keyboard Support**: Convenient keyboard input for quick calculations.
## Installation
To use this calculator, clone the repository and open the `calculator.html` file in your web browser.
git clone https://github.com/CharakaMihiranga/calculator.git
cd calculator
open calculator.html
## Usage
### Mouse Input
Click the buttons on the calculator to input numbers and operations.
### Keyboard Input
You can also use the following keyboard keys to operate the calculator:
- `0-9`: Numbers
- `+`: Addition
- `-`: Subtraction
- `*`: Multiplication
- `/`: Division
- `%`: Percentage
- `(`, `)`: Parentheses
- `.`: Decimal point
- `Enter`: Equals
- `Backspace`: Delete the last character
- `Delete`: Clear the input
## File Structure
- `calculator.html`: The main HTML file that contains the structure of the calculator.
- `style/style.css`: The CSS file for styling the calculator.
- `js/script.js`: The JavaScript file containing the logic for the calculator.
## Code Overview
### HTML
The HTML file sets up the structure of the calculator. It includes buttons for each number and operation, and display areas for the input and output.
### CSS
The CSS file is used to style the calculator, making it visually appealing and user-friendly.
### JavaScript
The JavaScript file handles the logic of the calculator. It includes event listeners for button clicks and keyboard inputs, functions to validate and clean the input, and to prepare and display the output.
## Screenshots
Here are some screenshots of the calculator in action:
