指標を設定 set-indicator

セットインジケーターは、タッチデバイスでビューアを使用したときにメインスウォッチの上にレンダリングされる一連のドットです。 ドットは、スクロールボタンを使用できない場合に、サムネールのページ間を移動するのに役立ちます。

設定インジケーターの CSS プロパティ

設定インジケーターコンテナの外観は、以下の CSS クラスセレクターを使用して制御します。

.s7mixedmediaviewer .s7setindicator
CSS プロパティ
説明
background-color
設定インジケーターの 16 進数形式の背景色。

例 — 背景が白の設定インジケーターを作成するには:

.s7mixedmediaviewer .s7setindicator {
 background-color: #FFFFFF;
}

個々のセットインジケーターのドットの外観は、CSS クラスセレクターを使用して制御します。

.s7mixedmediaviewer .s7setindicator .s7dot

CSS プロパティ
説明
width
設定インジケーターのドットの幅。
height
設定インジケーターのドットの高さ。
margin-left
左余白(ピクセル単位)。
margin-top
上余白(ピクセル単位)。
margin-right
右余白(ピクセル単位)。
margin-bottom
下余白(ピクセル単位)。
border-radius
境界線の半径(ピクセル単位)。
background-color
16 進数形式の背景色。
NOTE
インジケーターのドットを設定すると、 state 属性セレクター。サムネールの状態ごとに異なるスキンを適用するのに使用できます。 特に state="selected" は、現在のサムネールのページに対応します。 state="unselected" は、デフォルトのドットの状態に対応します。

例 — 15 x 15 ピクセルで、2 ピクセルの水平マージン、5 ピクセルの上マージン、1 ピクセルの下マージン、12 ピクセルの半径、#D5D3D3 default color および#939393アクティブな色を持つ設定インジケーターのドットを作成するには、次のように記述します。

.s7mixedmediaviewer .s7setindicator .s7dot {
 width:15px;
 height:15px;
 margin-left:2px;
 margin-top:5px;
 margin-right:2px;
 margin-bottom:1px;
 border-radius:12px;
 background-color:#D5D3D3;
}
.s7mixedmediaviewer .s7setindicator .s7dot[state="selected"] {
 background-color:#939393;
}
recommendation-more-help
b7426f53-aad9-4c00-83fc-664f30f681e8