左にスピンボタン spin-left-button

このボタンを選択すると、メインビューで画像が左にスピンします。 このボタンは、携帯電話では画面のスペースを節約するために表示されません。 また、多次元スピンセットを使用すると、このボタンは非表示になります。 CSS を使用して、ボタンのサイズ設定、スキン表示および配置を行うことができます。

スピンボタンの CSS プロパティ

このボタンは内部コンテナに追加されます。このコンテナは DIV で制御します。このコンテナは、CSS クラスセレクターを使用します。

.s7mixedmediaviewer .s7spinbuttons
CSS プロパティ
説明
トップ
パディングを含む上の境界線からの位置。
パディングを含む右の境界線からの位置。
パディングを含む左の境界線からの位置。
パディングを含む下の境界線からの位置。
width
ボタンの幅。
height
ボタンの高さ。

コンテナ内のこのボタンの外観は、CSS クラスセレクターを使用して制御します。

.s7mixedmediaviewer .s7spinbuttons .s7panleftbutton
CSS プロパティ
説明
トップ
パディングを含む上の境界線からの位置。
パディングを含む右の境界線からの位置。
パディングを含む左の境界線からの位置。
パディングを含む下の境界線からの位置。
ボタンの幅。
高さ
ボタンの高さ。
background-image
ボタンの特定の状態に対して表示される画像。
background-position

CSS スプライトを使用する場合は、アートワークスプライト内に配置します。

詳しくは、 CSS スプライト.

NOTE
このボタンは、 state 属性セレクター。ボタンの状態ごとに異なるスキンを適用するのに使用できます。

ボタンのツールチップはローカライズできます。 詳しくは、 ユーザーインターフェイス要素のローカライゼーション を参照してください。

例 — 28 x 28 ピクセルで、内側のコンテナの左端に配置する左スピンボタンを設定するには、次のように記述します。 最後に、は 4 つのボタンの状態ごとに異なる画像を表示します。

.s7mixedmediaviewer .s7spinbuttons .s7panleftbutton {
 position:absolute;
 left: 0px;
 width:28px;
 height:28px;
 background-size:contain;
 }
.s7mixedmediaviewer .s7spinbuttons .s7panleftbutton[state='up'] {
background-image:url(images/v2/SpinLeftButton_light_up.png);
}
.s7mixedmediaviewer .s7spinbuttons .s7panleftbutton[state='over'] {
background-image:url(images/v2/SpinLeftButton_light_over.png);
}
.s7mixedmediaviewer .s7spinbuttons .s7panleftbutton[state='down'] {
background-image:url(images/v2/SpinLeftButton_light_down.png);
}
.s7mixedmediaviewer .s7spinbuttons .s7panleftbutton[state='disabled'] {
background-image:url(images/v2/SpinLeftButton_light_disabled.png);
}
recommendation-more-help
b7426f53-aad9-4c00-83fc-664f30f681e8