ビデオスクラバー video-scrubber
ビデオスクラバーは、現在再生中のビデオ内の任意の時間の位置を動的に探すことができる水平スライダーコントロールです。
スクラバー「ノブ」は、再生中にビデオの現在の時間位置を示すために、ビデオの再生に合わせて移動します。 ビデオスクラバーは常にコントロールバーの幅全体を取ります。 CSSを使用して、ビデオスクラバーのスキンを作成し、その高さと垂直位置を変更することができます。
ビデオスクラバーの一般的な外観は、次のCSS クラスセレクターで制御されます。
.s7mixedmediaviewer .s7videoscrubber
.s7mixedmediaviewer .s7videoscrubber .s7videotime
.s7mixedmediaviewer .s7videoscrubber .s7knob
ビデオスクラバーのCSS プロパティ
次のCSS クラスセレクターは、背景、再生、読み込みのインジケーターを追跡します。
.s7mixedmediaviewer .s7videoscrubber .s7track
.s7mixedmediaviewer .s7videoscrubber .s7trackloaded
.s7mixedmediaviewer .s7videoscrubber .s7trackplayed
トラックのCSS プロパティ
次のCSS クラスセレクターは、ノブを制御します。
.s7mixedmediaviewer .s7videoscrubber .s7knob
ノブのCSS プロパティ
次のCSS クラスセレクターは、再生時間バブルを制御します。
.s7mixedmediaviewer .s7videoscrubber .s7videotime
バブル再生時間のCSS プロパティ
ビデオスクラバーのツールチップはローカライズできます。 詳しくは、 ユーザーインターフェイス要素のローカライゼーション を参照してください。
例 section-e8caea0a303c425a8a637c2a47c06355
高さ10 ピクセルのカスタムトラックカラーを持ち、コントロールバーの上端と左端から10 ピクセルと35 ピクセルに配置されたビデオスクラバーを使用して、混在メディアビューアを設定します。
.s7mixedmediaviewer .s7videoscrubber {
top:10px;
left:35px;
height:10px;
background-color:#AAAAAA;
}
.s7mixedmediaviewer .s7videoscrubber .s7track {
height:10px;
background-color:#444444;
}
.s7mixedmediaviewer .s7videoscrubber .s7trackloaded {
height:10px;
background-color:#666666;
}
.s7mixedmediaviewer .s7videoscrubber .s7trackplayed {
height:10px;
background-color:#888888;
}
recommendation-more-help
dynamic-media-developer-resources-help-aem-viewers-ref