semooh作。
Windowsなどでよく見る（最近は無い？）スピンボタンを実装します。
数値のテキスト入力ボックスに、上下の矢印が付いていて値を増減できるアレです。
テキストボックスに
jg="spin"
と記述すると、スピン機能が付与されます。
<input type="text" jg="spin" value="0" />
但し、このプラグインはボタンの見栄えを画像で作っているため、自身の環境にあわせてイメージを配置したり、パスを指定する必要があります。
詳しくは後述のオプションを参照して下さい。
見栄えの画像が入ったパスを指定します。
初期値は ”/img/spin/” です。
必ず、パスの最後は”/“まで入れて下さい。
ボタンの見栄えの各画像を設定します。
順に、「通常状態の画像」「ボタン上半部が押された時の画像」「ボタン下半部が押された時の画像」になります。
初期値は順に “spin-button.png”, “spin-up.png”, “spin-down.png” です。
これらの画像は、ダウンロードページにある spin-images.tar.gz にサンプル的なものが入っていますので、自分で用意したく無い場合は使って下さい。
ボタンが押された際に増減する値の量です。
例えば現在の値が10でintervalを3に設定していた場合、上ボタンを押せば13、下ボタンなら7になります。
<input type="text" jg="spin" jg:spin="interval:5" value="0" />
初期値は1です。
値の最大値/最小値です。
ボタンを上下させてもこの範囲までしか変化しませんが、テキストボックスに直接入力された場合は何でも入力されます。
もし直接の入力を禁止したい場合は、テキストボックスをlockするなどすると良いでしょう。
<input type="text" jg="spin" jg:spin="max:10,min:-5" value="0" />
これらの値にnullが入っている場合、値の制限は無くなります。
初期値は共にnullです。
スピンボタンを押しっぱなしにした際に、値が変化する時間の間隔をミリ秒単位で設定します。
<input type="text" jg="spin" jg:spin="timeInterval:250" value="0" />
初期値は500です。
スピンボタンを押した際に、ボタンの見栄えがブリンクします。
その瞬く時間をミリ秒単位で設定します。
<input type="text" jg="spin" jg:spin="timeBlink:400" value="0" />
初期値は200です。
値やintervalに小数を設定することも可能ですが、常に浮動小数の精度の問題は発生します。
出来れば、小数の必要なものには使わないことをお勧めします。
<input type="text" jg="spin" jg:spin="interval:0.01" value="9.95" />