jQuery Easy Calculator Plugin

jQuery Easy Calculator Plugin
File Size: 46.6 KB
Views Total: 9946
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   

A jQuery plugin that pops up a simple or scientific calculator to an input field on focus. Click the USE button on the calculator will insert the current value to your input field.  It also contains 15 localisations that you can use this plugin on your websites in other major languages.

Basic Usage:

1. Include jQuery Library and jquery.calculator.js before </head> tag

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript" src="jquery.calculator.js"></script>

2. Call the plugin

<script type="text/javascript">
$(function () {
	$('#basicCalculator').calculator({
		showOn: 'both', buttonImageOnly: true, buttonImage: 'calculator.png'});
});
</script>

3. Include calculator CSS

<link rel="stylesheet" type="text/css" href="jquery.calculator.css">

4. Markup

<input type="text" id="basicCalculator">

This tutorial demonstrates the very basics of the jQuery Calculator plugin.  It contains the minimum requirements for using the plugin and can be used as the basis for your own experimentation. For more detail see the documentation reference page.

Change log:

v2.0.1 (2014-06-21)

  • update to the latest version.

v2.0.0 (2014-01-19)

  • update to the latest version.

This awesome jQuery plugin is developed by kbwood. For more Advanced Usages, please check the demo page or visit the official website.