jQuery UI の Spinner で作るスピナーのアイコンを指定する方法。
実装例（サンプル）
実装例（サンプル）について
デフォルトの「▲」と「▼」を、「＋」と「－」に変更した。
実装例（サンプル）の動作について
「＋」をクリックすると、インプット欄の数値に「1」を加える。
「－」をクリックすると、インプット欄の数値から「1」を引く。
実装例（サンプル）のソースコード
読み込み
パスは、それぞれ、アップロードした場所を指定する。
<link rel="stylesheet" href="jquery-ui.css">
<script type="text/javascript" src="jquery-1.9.1.js"></script>
<script type="text/javascript" src="ui/1.10.2/jquery-ui.js"></script>
<script type="text/javascript" src="jquery-1.9.1.js"></script>
<script type="text/javascript" src="ui/1.10.2/jquery-ui.js"></script>
JavaScript
アイコンは、iconsオプションで指定できる。
<script>
jQuery( function() {
jQuery( "#sampleSpinner" ).spinner(
{
icons: {
up: "ui-icon-plus",
down: "ui-icon-minus"
}
}
);
} );
</script>
jQuery( function() {
jQuery( "#sampleSpinner" ).spinner(
{
icons: {
up: "ui-icon-plus",
down: "ui-icon-minus"
}
}
);
} );
</script>
HTML
<input id="sampleSpinner">