jQuery Knob

(0.0)

Strona wtyczki

Oficjalna witryna wtyczki

Dokumentacja

Sprawdź wszystkie opcje jakie oferuje plugin

Github

Repozytorium Github

Wersja jQuery: jquery >=1.7.0

Wersja jQuery z którą współpracuje plugin

Licencja: MIT

Licencja

Zobacz więcej

Strona wtyczki:	Strona wtyczki
Dokumentacja:	Dokumentacja
Github:	Github
Wersja jQuery:	jquery >=1.7.0
Licencja:	MIT
Zgłoś błąd:	Zgłoś błąd
Data opublikowania:	2014-09-02

Historia wersji

Wersja	Data publikacji
1.2.11	2014-09-02
1.2.9	2014-06-25
1.2.8	2014-05-06
1.2.3	2013-11-11
1.2.2	2013-01-29

Plugin przekształca elementy wejściowe na interaktywne tarcze jQuery, które reagują na obsługę przyciskiem myszy i scrolla, klawiatury (on focus) jak również dotyk. Jest on zbudowany przy użyciu canvas, i jest w pełni konfigurowalny przez ustawienie atrybutów danych.

Instalacja

Biblioteki
HTML
JS

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="jquery.knob.js"></script>

<div class="demo">
    <input class="knob" data-width="100" data-bgColor="#dbdbdb" data-displayInput=false value="35">
</div>
<div class="demo">
    <input class="knob" data-width="150" data-cursor=true data-bgColor="#dbdbdb" data-fgColor="#222222" data-thickness=.3 value="29">
</div>
<div class="demo">
    <input class="knob" data-width="200" data-min="-100" data-bgColor="#dbdbdb" data-displayPrevious=true value="44">
</div>
<div class="demo">
    <input class="knob" data-angleOffset=90 data-linecap=round data-bgColor="#dbdbdb" value="35">
</div>
<div class="demo">
    <input class="knob" data-angleOffset=-125 data-angleArc=250 data-bgColor="#dbdbdb" data-fgColor="#66EE66" value="35">
</div>
<div class="demo">
    <input class="knob" data-min="-15000" data-displayPrevious=true data-bgColor="#dbdbdb" data-max="15000" data-step="1000" value="-11000">
</div>
<div class="demo">
    <input class="knob" data-width="75" data-displayPrevious=true data-bgColor="#dbdbdb" data-fgColor="#ffec03" data-skin="tron" data-cursor=true value="75" data-thickness=".2">
</div>
<div class="demo">
    <input class="knob" data-width="150" data-displayPrevious=true data-bgColor="#dbdbdb" data-fgColor="#ffec03" data-skin="tron" data-thickness=".2" value="75">
</div>
<div class="demo">
    <input class="knob" data-width="150" data-angleOffset="180" data-bgColor="#dbdbdb" data-fgColor="#C0ffff" data-skin="tron" data-thickness=".1" value="35">
</div>

$(document).ready(function(){
	$(".knob").knob();
});