jQueryUIでスライダーを表示する

jQueryUIでスライダーを表示します。

数値を入力する時にスライダーを使用します。

まずjqueryとjquery-ui.min.js、jquery-ui.cssをプリロードします。

スライダーにはいろいろなオプションがあります。

max スライダーの最大値
min スライダーの最小値
range “min” or “max”
value スライダーの初期値
スライダーを動かすとセレクトボックスの値が変わり、逆にセレクトボックスの値を変えても、スライダーの値は変わりません。

セレクトボックス変更時にスライダーを変更するにはセレクトボックスのchangeイベントに処理を記述する必要があります。

スライダー自体はあまり使い道がないように思います。

DEMO

jquery.uiの詳細はこちらをどうぞ。

jQueryUIでスライダーを表示する

スポンサーリンク
  • このエントリーをはてなブックマークに追加
スポンサーリンク

コメントをどうぞ

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

CAPTCHA