Skip to content

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

3 Commits
 
 
 
 
 
 
 
 
 
 

Repository files navigation

✨ 毛玻璃风格计算器 (Glassmorphism Calculator)

这是一个基于原生 HTML5 + CSS3 + JavaScript (ES6) 构建的现代化网页计算器。它采用了时下流行的毛玻璃(Glassmorphism)设计风格,并内置了本地存储功能,可以在浏览器中长久保存你的计算历史记录。

🌐 在线体验地址https://wuwang660.github.io/Simple-JavaScript-Calculator/


🚀 核心功能与特性

  • 基础运算:支持加减乘除(+-×÷)以及百分比(%)计算。
  • 高精度修正:内置了 precise() 防浮点误差方法,完美解决 0.1 + 0.2 = 0.30000000000000004 等常见编程问题。
  • 本地历史记录:计算结果会自动保存在浏览器的 localStorage 中。关闭或刷新页面后,历史数据依然存在,支持一键清空。
  • 双模式交互:既可以通过鼠标点击屏幕按钮,也完美支持键盘直接输入。
  • 细腻的交互反馈:按钮具有悬停上浮效果和点击动画(@keyframes animate),操作手感流畅。

⌨️ 键盘快捷键指南

为了提升操作效率,计算器支持以下快捷键:

键盘按键 功能描述
数字键 (0-9)小数点 (.) 输入数字
+ - * / 输入运算符 (注:实际显示为 ×÷)
Enter (回车键) 执行运算并显示结果
Backspace (退格键) 删除输入框最后一个字符
Escape (ESC键) 一键清空当前输入内容

📂 项目文件结构

计算器项目/
├── index.html          # 页面结构
├── calculator.css      # 样式布局
├── calculator.js       # 核心逻辑
└── icons/              # 存放按钮图标的文件夹
    ├── 最近使用.png     # 历史记录按钮图标
    └── 清空.png         # 清空历史按钮图标

About

一个支持本地存储历史记录、键盘操作的毛玻璃风格计算器

Resources

Stars

0 stars

Watchers

0 watching

Forks

Releases

Packages

Contributors

Languages