マウスホイール操作のスピンボックス

■動作サンプル

テキストボックスの横のアイコンの上にマウスカーソルを乗せてホイール操作

サンプル1	範囲：0～100、増減値：1
サンプル2	範囲：0～100、増減値：5
サンプル3	範囲：0～10、増減値：0.5
サンプル4	範囲：-50～50、増減値：1
サンプル5	範囲：-5.0～5.0、増減値：0.5

■使い方

ZIPファイルを解凍後（中身はmouseSpinBox.jsとアイコン画像のセット）、各ファイルを任意のディレクトリに配置し、
本機能を実装したいhtmlでJSファイルを読み込む。

<script type="text/javascript" src="js/mouseSpinBox.js"></script>

本JSを適用したいinput要素のクラスに「mouseSpinBox」を指定し、
（指定するクラス名はjsファイルの設定値で任意に変更可能）
該当input要素に指定可能な値の範囲（最大値,最小値）とマウスホイールで増減する数値、
アイコンの挿入位置（before/after）、小数点以下の表示桁数（オプション）を"["と"]"で囲んで指定する。
この時、input要素には必ずid属性を指定する。

<input type="text" name="sample1" id="sample1" class="mouseSpinBox[0,100,1,before]" value="0" />

jsファイルの設定値で、アイコン画像のパスや動作に関する設定をサイトに合わせて編集する。
設定値の概要は下記を参照。

javascriptの設定

12～23行目付近の設定値に、本JSの対象とする要素のクラス名と挿入されるアイコンのパスやスタイルなどをセットする。

初期設定値のままで使用する場合は変更しなくも良い

config : {
	targetClass : 'mouseSpinBox',
	icon : {
		path : './images/icon_mouse_wheel.gif',
		alt : '',
		width : '12',
		height : '14',
		style : 'cursor:n-resize; padding:0; margin:2px 1px 0 0; vertical-align:middle;'
	}
},