今天给大家分享一款白色简洁样式计算器JS代码是一款精美简洁计算器JS代码插件网页特效,软件应用,后台应用JS计算器插件代码免费下载。适用浏览器:360、FireFox、Chrome、Safari、Opera、傲游、搜狗、世界之窗. 不支持IE8及以下浏览器。

在线预览   源码下载

实现的代码。

html代码:

<div id="calcuator">
<input type="text" id="input-box" value="0" size="21" maxlength="21" readonly="readonly" />
<div id="btn-list">
<div onclick="operator('clear')" class=" btn-30 btn-radius color-red clear-marginleft">
C</div>
<div onclick="operator('opposite')" class=" btn-30 btn-radius color-blue">
+/-</div>
<div onclick="operator('percent')" class=" btn-30 btn-radius color-blue">
%</div>
<div onclick="operator('backspace')" class=" btn-70 btn-radius color-red font-14">
←</div>
<div onclick="typetoinput('7')" class=" btn-30 btn-radius clear-marginleft">
7</div>
<div onclick="typetoinput('8')" class=" btn-30 btn-radius">
8</div>
<div onclick="typetoinput('9')" class=" btn-30 btn-radius">
9</div>
<div onclick="operator('plus')" class=" btn-30 btn-radius color-blue font-14">
+</div>
<div onclick="operator('minus')" class=" btn-30 btn-radius color-blue font-14">
-</div>
<div onclick="typetoinput('4')" class=" btn-30 btn-radius clear-marginleft">
4</div>
<div onclick="typetoinput('5')" class=" btn-30 btn-radius">
5</div>
<div onclick="typetoinput('6')" class=" btn-30 btn-radius">
6</div>
<div onclick="operator('multiply')" class=" btn-30 btn-radius color-blue font-14">
×</div>
<div onclick="operator('divide')" class=" btn-30 btn-radius color-blue font-12">
÷</div>
<div onclick="typetoinput('1')" class=" btn-30 btn-radius clear-marginleft">
1</div>
<div onclick="typetoinput('2')" class=" btn-30 btn-radius">
2</div>
<div onclick="typetoinput('3')" class=" btn-30 btn-radius">
3</div>
<div onclick="operator('pow')" class=" btn-30 btn-radius color-blue font-14">
ײ</div>
<div onclick="operator('sqrt')" class=" btn-30 btn-radius color-blue font-12">
√</div>
<div onclick="typetoinput('0')" class=" btn-70 btn-radius clear-marginleft">
0</div>
<div onclick="typetoinput('.')" class=" btn-30 btn-radius">
.</div>
<div onclick="operator('result')" class=" btn-70 btn-radius color-red font-14">
=</div>
</div>
</div>

via:http://www.w2bc.com/Article/25923

基于js白色简洁样式计算器的更多相关文章

  1. 基于js alert confirm样式弹出框

    基于js alert confirm样式弹出框.这是一款根据alert confirm优化样式的确认对话框代码. 在线预览   源码下载 实现的代码. html代码: <div id=" ...

  2. 文献综述六:基于JS 技术的电子商品管理系统设计及实现

    一.基本信息 标题:基于JS 技术的电子商品管理系统设计及实现 时间:2017 出版源:无线互联科技 文件分类:js技术的研究 二.研究背景 主要对Js下电商管理系统的设计及实现进行了探讨,利用软件工 ...

  3. 基于JS实现回到页面顶部的五种写法(从实现到增强)

    这篇文章主要介绍了基于JS实现回到页面顶部的五种写法(从实现到增强)的相关资料,本文介绍的非常详细,实用性也非常高,非常具有参考借鉴价值,需要的朋友可以参考下   写法 [1]锚点 使用锚点链接是一种 ...

  4. 微信小程序跑马灯效果--基于CSS3 animation 及 基于JS

    如果本文对你有用,请爱心点个赞,提高排名,帮助更多的人.谢谢大家!❤ 如果解决不了,可以在文末进群交流. 基于CSS3主要代码实现 效果图: 视图模板wxml中: <view class=&qu ...

  5. js设置css样式.

    在js设置css样式做法 var obj = document.getElementById('div'); obj.style.width = '100px'; obj.style.height = ...

  6. 基于JS功能强大的日期插件Kalendae

    开发中需要一个日期插件,可以在zepto下使用,可以选择日期段,可以设置不可选日期 找到一个完全满足的,并且基于JS不依赖于任何库. 在线演示:http://chipersoft.com/Kalend ...

  7. php有效的过滤html标签,js代码,css样式标签

    过滤html标签�php中太简单了,我们可以直接使用strip_tags函数来实现了,下面给各位整理了一些关于 strip_tags函数的例子. php过滤html的函数:strip_tags(str ...

  8. Breach - HTML5 时代,基于 JS 编写的浏览器

    Breach 是一款属于 HTML5 时代的开源浏览器项目,,完全用 Javascript 编写的.免费.模块化.易于扩展.这个浏览器中的一切都是模块,Web 应用程序在其自己的进程运行.通过选择合适 ...

  9. 常见排序算法基于JS的实现

    一:冒泡排序 1. 原理 a. 从头开始比较相邻的两个待排序元素,如果前面元素大于后面元素,就将二个元素位置互换 b. 这样对序列的第0个元素到n-1个元素进行一次遍历后,最大的一个元素就“沉”到序列 ...

随机推荐

  1. 详解REMOTE_ADDR,HTTP_CLIENT_IP,HTTP_X_FORWARDED_FOR

    转载自:http://www.cnblogs.com/lmule/archive/2010/10/15/1852020.html 看ecshop的lib_base.php的时候里面获取客户端真实ip的 ...

  2. FFMPEG中最要害的结构体之间的关系

    FFMPEG中最关键的结构体之间的关系 http://www.myexception.cn/program/1404591.html FFMPEG中结构体很多.最关键的结构体可以分成以下几类: a)  ...

  3. 软件调试工具——GDB

    1.GDB调试器概述 GDB是GNU开源组织发布的一个强大的程序调试工具,具有查看程序运行状态.设置断点.查看表达式.显示变量等众多功能,是程序员进行Linux编程必须要掌握的一种调试技术. GDB调 ...

  4. 简单测试Demo:如何用Java压缩文件夹和文件

    一.直接贴出测试代码 package com.jason.zip; import java.io.File; import java.io.FileInputStream; import java.i ...

  5. SLAX初体验

    Slax是一个便捷.便携的Linux操作系统.它的界面既充满时尚感,又可基于不同模块的功能运作.它的界面富有时尚感,并集成了不同的模块的界面.尽 管它的容量十分娇小,Slax依然预载了不少日常应用的软 ...

  6. vlc模块间共享变量

    在模块中创建变量: vlc_value_t  valTemp; var_Create( p_intf, "vlc_test", VLC_VAR_STRING  ); valTemp ...

  7. 深入理解磁盘文件系统之inode(转)

    一.inode是什么? 理解inode,要从文件储存说起. 文件储存在硬盘上,硬盘的最小存储单位叫做"扇区"(Sector).每个扇区储存512字节(相当于0.5KB). 操作系统 ...

  8. ffmpeg Win8移植记(一)

    最近和同事一起合作,移植ffmepg到Win8平台上. Windows Store 要求3个架构X86 X64 ARM, 我们主要做的就是X86和ARM的平台, X86的平台移植的文章已经很多了.我推 ...

  9. iOS动画进阶 - 实现炫酷的上拉刷新动效

    移动端訪问不佳,请訪问我的个人博客 近期撸了一个上拉刷新的小轮子.仅仅要遵循一个协议就能自己定义自己动效的上拉刷新和载入,我自己也写了几个动效进去,以下是一个比較好的动效的实现过程 先上效果图和git ...

  10. 【Linux】rmdir命令

    用途 rmdir用于删除空目录 全称 rmdir的全称是:Remove Directory 参数 -p:连同上层空的目录一起删除 案例 现在有文件结构如下 test3 文件夹为空文件夹 test/te ...