비디오 스크러버는 사용자가 현재 재생 중인 비디오 내의 모든 시간 위치를 동적으로 찾을 수 있는 가로 슬라이더 컨트롤입니다.
비디오가 재생될 때 스크러버 '손잡이'도 움직여서 재생 중 비디오의 현재 시간 위치를 가리킨다. 비디오 스크러버는 항상 컨트롤 막대의 전체 너비를 사용합니다. CSS를 사용하여 비디오 스크러버의 스킨을 만들고, 높이 및 세로 위치를 변경할 수 있습니다.
비디오 스크러버의 일반적인 모양은 다음 CSS 클래스 선택기로 제어됩니다.
.s7mixedmediaviewer .s7videoscrubber
.s7mixedmediaviewer .s7videoscrubber .s7videotime
.s7mixedmediaviewer .s7videoscrubber .s7knob
비디오 스크러버의 CSS 속성
최상위 |
패딩을 포함하여 위쪽 테두리에서 위치. |
하단 |
패딩을 포함하여 아래쪽 테두리에서 위치합니다. |
height |
비디오 스크러버의 높이입니다. |
background-color |
비디오 스크러버 색입니다. |
다음 CSS 클래스 선택기는 배경, 재생 및 로드 지표를 추적합니다.
.s7mixedmediaviewer .s7videoscrubber .s7track
.s7mixedmediaviewer .s7videoscrubber .s7trackloaded
.s7mixedmediaviewer .s7videoscrubber .s7trackplayed
트랙의 CSS 속성
height |
해당 트랙의 높이입니다. |
background-color |
해당 트랙의 색입니다. |
다음 CSS 클래스 선택기는 손잡이를 제어합니다.
.s7mixedmediaviewer .s7videoscrubber .s7knob
노브의 CSS 속성
최상위 |
세로 손잡이 오프셋. |
width |
손잡이 폭. |
height |
손잡이 높이. |
background-image |
손잡이 아트워크. |
background-position |
CSS 스프라이트를 사용하는 경우 아트워크 스프라이트 내부에 배치합니다. 다음을 참조하십시오 CSS 스프라이트 . |
다음 CSS 클래스 선택기는 재생된 시간 버블을 제어합니다.
.s7mixedmediaviewer .s7videoscrubber .s7videotime
재생된 시간의 CSS 속성 버블
font-family |
시간에 사용할 글꼴 모음 표시 텍스트입니다. |
font-size |
시간 표시 텍스트에 사용할 글꼴 크기입니다. |
color |
시간 표시 텍스트에 사용할 글꼴 색상입니다. |
width |
버블 영역 폭. |
height |
거품 영역 높이입니다. |
패딩 |
버블 영역 패딩. |
background-image |
버블 아트워크. |
background-position |
CSS 스프라이트를 사용하는 경우 아트워크 스프라이트 내부에 배치합니다. 다음을 참조하십시오 CSS 스프라이트 . |
text-align |
텍스트를 버블 영역과 정렬합니다. |
비디오 스크러버 도구 팁을 현지화할 수 있습니다. 다음을 참조하십시오 사용자 인터페이스 요소의 현지화 추가 정보.
사용자 지정 트랙 색상이 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;
}