- canvas based ; no png or jpg sprites
- touch, mousewheel, keyboard events implemented
- downward compatible ; overloads an input element
Options are provided as attributes 'data-option':
<input type="text" class="dial" data-min="-50" data-max="50">
The following options are supported :
- min : min value
- max : max value
- cursor : display mode "cursor" | default=gauge
- thickness : gauge thickness
- width : dial width
- displayInput : default=true | false=hide input
- fgColor : foreground color
- bgColor : background color
- ticks : number of ticks | 0=disable
- tickColor
- tickLength
- tickWidth
- tickColorizeValues : colorize ticks
- readOnly : disable input and events
- skin : default | "tron"
<script>
$(".dial").knob({
'release':function(e) { /*make something*/ }
});
</script>
-
'release' : executed on release.
Parameters : - value : int, current value - input : jQuery element, input element
'change' : executed at each change of the value
Parameters : - value : int, current value
'draw' : when drawing the canvas
<input type="text" value="75" class="dial"> <script> $(function() { $(".dial").knob(); } </script>
<input type="text" value="75" class="dial"> <script> $(".dial").knob( { 'change':function(e){ console.log(e); } } ) .val(79); </script>
Tested on Chrome, Safari, Firefox. Not tested on MSIE.
- keyboard/mousewheel control refactoring / acceleration
- bugfix no keyboard or mousewheel when readonly
- bugfix min/max can be exceeded
- hooks / keyboard events
jquery-knob's People
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. ๐๐๐
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google โค๏ธ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.