スライダーの追加 (HTML)

[ この記事は、Windows ランタイム アプリを作成する Windows 8.x および Windows Phone 8.x 開発者を対象としています。Windows 10 向けの開発を行っている場合は、「最新のドキュメント」をご覧ください]

スライダーを使うと、連続する領域内でユーザーが値を選べるようになります。

この図は、現在 61 という値を示しているスライダーです。この 61 を示すインジケーターは、"サム" と呼ばれます。ユーザーがサムをタップすると、値がヒントに表示されます。ユーザーが連続しているトラックをタップすると、サムはトラックのその場所にジャンプします。

スライダー コントロール

目盛り 目盛りは、スライダーを使って、連続するより小さな浮動小数点値を入力できるように設定されていない場合に表示されます。目盛りは、必ずサムのスナップ位置ですが、スナップ位置のすべてを表すわけではありません。たとえば、幅が 200 ピクセルしかない 100 ステップのスライダーに 100 個の目盛りは表示されません。目盛りが多すぎて見づらくなります。2 つの目盛りの間隔が 19 ピクセル未満の場合、どちらかの目盛りのレンダリングを省略する必要があります。

既定の位置は、水平の場合はトラックの上部、垂直の場合はトラックの左側です。"display:none" CSS プロパティを上書きすると、反対側または両側に表示できます。

"color:transparent" を設定すると、目盛りが表示される領域を保ったまま、目盛りを非表示にすることもできます。

細かさの制御 トラック上を押している間に表示される矢印の大きさと長さは、スライダーの移動の細かさを示します。ユーザーがサムから遠くにドラッグするほど、指の動きに比べてサムの動きが遅くなります。