您的当前位置:首页>全部文章>文章详情

【Javascript】CSS3和js超酷iPhone样式科学计算器插件

jQuery之家发表于:2024-11-06 11:50:52浏览:247次TAG: #javascript

CalcSS3是一款非常酷的CSS3和js模仿iPhone样式科学计算器插件。该计算器插件没有使用图片,纯CSS制作。该计算器是科学型的,可以处理乘方、开方、指数、对数等复杂的数学运算。

它的特点有:

  • 不使用时不占用内存,不需要任何安装。
  • 使用时只占用极少的内存。
  • 关闭后会释放所有的占用内存。
  • 计算器的“记忆”功能不是摆设,可以像真实计算器一样使用。
  • 支持键盘操作。
  • 可以使用Ctrl+CCtrl+V进行复制粘贴。
  • 支持4种模式的数字组合:[1234.5][1234,5][1,234.5][1.234,5](通过左上角的小圆圈选项切换)。
  • 字体大小动态调整以适应阅读的需要。(通过左上角的小圆圈选项切换)
  • 可以在简单和科学型计算器之间切换。
  • 理论上可以使用无限级的括号。
  • 不需要添加封闭括号。
  • iPhoto样式外观,时尚大方。

键盘支持

下面是该计算器所有按钮对应键盘上的按键。

  • 数字和+ - x ÷ , . =对应于键盘上的相同按键。
  • 使用退格键[Backspace]可以消除一个数字或符号。
  • 回车键[Enter]代表=符号。
  • 热键:[h,s]表示在按下h或H键时,你会在显示区域右下角看到一个"hold"标记。这时,下面按键的含义会有所不同:[s]=sin,但是[h,s]=sinh。
  • 使用Ctrl+CCtrl+V进行复制粘贴。
  • Tab键可以将计算器在简单型和科学型之间进行切换。
标准计算按键
  • C
    点击[Del]键用于清除显示的数字。另外还有在按下任何函数和功能键之前可以清除错误的输入数字。
  • AC
    点击[Del]键用于清除显示的数字,常数和待定的操作。
  • mc
    点击[v]键用于清除“记忆”功能。
  • m+
    点击[b]键用于在“记忆”中添加显示在显示区域的数字。如果“记忆”中没有数字,会数字保存到“记忆”中
  • m-
    点击[n]键从“记忆”中清除显示区域的数字。
  • mr
    点击[m]键用于将显示区域的数字和“记忆”中的数字进行替换。
  • +/–
    [#] 改变代数符号。
  • =
    [ENTER] 用于结束函数和运算,显示计算结果。计算的表达式可以不使用闭括号,例如:2*(2+3*(2+4))=40 和 2*(2+3*(2+4=40 的结果是一样的。
科学计算按键
  • 2nd
    [Space]键(空格键)改变三角函数(sin, cos, tan, sinh, cosh, tanh)为它们的反函数(sin-1, cos-1, tan-1, sinh-1, cosh-1, and tanh-1)。它也会改变ln为log2,ex为2x。点击两次会返回原来的函数。
  • (
    [(]键会打开一个括号表达式。表达式可以嵌套。点击后会出现一个白色的边框,让你知道该括号表达式仍然处于激活状态,直到出现闭括号或等号。
  • )
    [)] 关闭一个括号表达式。
  • %
    [%] 用于百分比计算。要计算百分比,通过+, –, × 或 ÷键来操作。例如,要计算500的8%,输入500 x 8 %(不需要等号键),将返回40。要计算一些折扣之类的表达式,需要添加等号键,例如,500 + 8 % = 返回540。
  • 1/x
    [\ or h, 1] 返回分数形式的数字。
  • x2
    [h, 2] 返回平方数。
  • x3
    [h, 3] 返回立方数。
  • yx
    [^ or ' or "] 返回x(第一个数)的y(第二个数)次方。例如要计算34,输入3 yx 4 = 返回81。
  • x!
    [x] 计算x的阶乘(只能是一个整数)。
  • [h, r] 计算一个数的平方根。
  • xy
    [r] 用于计算x(第一个数)的开y(第二个数)次方根。例如,计算4√81,输入81 x√y 4 = 结果为3。
  • log
    [Shift+L] 返回一个数基于10的对数值。
  • sin
    [s] 计算一个数的正弦值。
  • sin-1
    [Shift+S] 计算一个数的反正弦值。(在2nd键按下时才有作用)
  • cos
    [c] 计算一个数的余弦值。
  • cos-1
    [Shift+C] 计算一个数的反余弦值。(在2nd键按下时才有作用) [Shift+C] Calculates the arc cosine of a value. (Available when the 2nd button is clicked.)
  • tan
    [t] 计算一个数的正切值。
  • tan-1
    [Shift+T] 计算一个数的反正切值。(在2nd键按下时才有作用)
  • ln
    [l] 计算一个数的自然对数值。
  • log2
    [h, l] 计算基于2的对数值。(在2nd键按下时才有作用)
  • sinh
    [h, s] 计算一个数的双曲正弦值。
  • sinh-1
    [h, Shift+S] 计算一个数的反双曲正弦值。(在2nd键按下时才有作用)
  • cosh
    [h, c] 计算一个数的双曲余弦值。
  • cosh-1
    [h, Shift+C] 计算一个数的反双曲余弦值。(在2nd键按下时才有作用)
  • tanh
    [h, t] 计算一个数的双曲正切值。
  • tanh-1
    [h, Shift+T] 计算一个数的反双曲正切值。(在2nd键按下时才有作用)
  • ex
    [e] 计算常数'e'(2.718281828459045…)的x(输入的数值)次方。
  • 2x
    [Shift+X or h, e] 计算2的x(输入的数值)次方。例如,10 2x = 1024 (在2nd键按下时才有作用)
  • Rad
    [d or °] 改变为以弧度表示的三角函数模式。
  • Deg
    [d or °] [d or °] 改变为以度数表示的三角函数模式。
  • π
    [p]输入圆周率 PI 或π (3.141592653589793…)。
  • EE
    [Shift+E] 用于当前显示的数字乘以下一次输入的数字的10次方。
  • Rand
    [h, n or h, d] 返回0-1之间的随机数。

关于该计算器的更详细的信息可以参考它的主页:http://www.dematte.at/calculator/#usage

资源分享:https://www.51bj.top/home/assets/8.html

猜你喜欢

【JavaScript】JS获取时间并格式化
方法一:使用JavaScript的Date对象和相关方法来获取时间并格式化var now = new Date();   // 格式化日期 var year = now.getFullYear(); var month = (now.getMonth() + 1 < 10 ? "0"&nbs
发表于:2024-08-14 浏览:302 TAG:
【JavaScript】JS时间和时间戳互转
在JavaScript中,获取当前时间的时间戳(秒值)可以使用 Date.now() 方法,而将时间戳转换为日期格式可以使用 Date 对象。获取当前时间戳(秒值):let timestampSeconds = Date.now() / 1000; console.log(timestampSeconds); // 输出的是以秒为单位的时间戳将时间戳转换为日期:let timestampSeconds =&
发表于:2024-08-14 浏览:266 TAG:
【Javascript】localStorage和sessionStorage的使用
一、什么是localStorage、sessionStorage在HTML5中,新加入了一个localStorage特性,这个特性主要是用来作为本地存储来使用的,解决了cookie存储空间不足的问题(cookie中每条cookie的存储空间为4k),localStorage中一般浏览器支持的是5M大小,这个在不同的浏览器中localStorage会有所不同。 二、localStorage的优势与局限localStorage的优势1、localStorage拓展了cookie的4K限制2
发表于:2024-03-27 浏览:339 TAG: #javascript #localstorage #sessionstorage
【JavaScript】如何从 JavaScript 数组中删除重复元素?
在 JavaScript 中,有多种方法可以从数组中删除重复元素。在本文中,我们将探讨一些删除重复元素的顶级方法。使用filter()方法filter()方法使用传递的条件创建一个新的元素数组。这将仅包含作为此过滤器方法的一部分返回 true 的元素。因此,要实现删除重复元素,我们只需在 filter() 方法中添加条件即可,它会完成剩下的工作。#过滤器.js<script>    var arr = ["stev
发表于:2024-04-16 浏览:307 TAG:
【JavaScript】JS四舍五入保留两位小数(一)
1 、tofixed方法toFixed() 方法可把 Number 四舍五入为指定小数位数的数字。但是其四舍五入的规则与数学中的规则不同,使用的是银行家舍入规则。**银行家舍入:所谓银行家舍入法,其实质是一种四舍六入五取偶(又称四舍六入五留双)法。**具体规则如下:简单来说就是:四舍六入五考虑,五后非零就进一,五后为零看奇偶,五前为偶应舍去,五前为奇要进一。如下:> (3.61).toFixed(1)    //四舍 '3.6&#3
发表于:2024-03-12 浏览:322 TAG:
【JavaScript】JS防抖动方法
防抖动是指在事件被触发时,为了减少因为快速连续操作导致的大量事件触发,通常会设置一个延时,当事件被触发后,等待一段时间,如果在这段时间内没有新的相同事件被触发,则执行该事件的操作。在JavaScript中,防抖动通常可以通过设置定时器来实现。当事件触发时,如果已经有一个定时器在等待,则清除它并重新设置一个新的定时器。只有当定时器到期而事件也没有被触发时,事件绑定的处理函数才会执行。function debounce(fn, wait) {   l
发表于:2024-04-24 浏览:278 TAG:
【JavaScript】js复制内容到剪切板
复制内容到剪切板分两种情况,一种是从页面已有的可选元素中选中内容进行复制,一种是将Javascript代码中的字符串直接复制到剪切板。一 、复制页面元素选中内容html<input type="textarea" id="txt" /> <button onclick="copy()">复制</button>jsfunction copy()&nbs
发表于:2024-08-13 浏览:338 TAG: #javascript
【JavaScript】js获取父级元素
在JavaScript中,我们可以使用以下方法来获取元素的父级:  1、 使用parentNode属性:可以通过访问元素的parentNode属性来获取其直接父级元素。例如:var element = document.getElementById('myElement'); var parentElement = element.parentNode;2、 使用parentElement属性:与pa
发表于:2024-05-11 浏览:262 TAG:
【JavaScript】纯CSS蜂巢式图片画廊效果
这是一款纯CSS蜂巢式图片画廊效果。该CSS蜂巢式图片画廊通过CSS网格布局,将图片以蜂巢的六边形进行布局,非常炫酷。
发表于:2024-11-06 浏览:245 TAG: #CSS #图像
【JavaScript】JS中referer的使用
HTTP请求中有一个referer的报文头,用来指明当前流量的来源参考页。例如在www.sina.com.cn/sports/上点击一个链接到达cctv.com首页,那么就referrer就是www.sina.com.cn/sports/了。在Javascript中,我们可以通过document.referrer来获取同样的信息。通过这个信息,我们就可以知道访客是从什么渠道来到当前页面的。这对于Web Analytics来说,是非常重要的,这可以告诉我们不同渠道带来的流量的分布情况,还有用户搜索
发表于:2024-04-24 浏览:357 TAG: