비디오 플레이어 video-player

비디오 플레이어는 비디오 컨텐츠가 뷰어 내에 표시되는 사각형 영역입니다.

재생 중인 비디오의 치수가 비디오 플레이어의 치수와 일치하지 않으면 비디오 컨텐츠가 비디오 플레이어의 사각형 표시 영역 내에서 가운데에 표시됩니다.

다음 CSS 클래스 선택기는 비디오 플레이어의 모양을 제어합니다.

.s7mixedmediaviewer .s7videoplayer

비디오 플레이어의 CSS 속성

시스템에서 비디오를 재생할 수 없는 경우 표시되는 오류 메시지는 현지화할 수 있습니다. 자세한 내용은 사용자 인터페이스 요소의 지역화를 참조하십시오.

예 - 비디오 플레이어를 투명하게 하려면 다음을 수행하십시오.

.s7mixedmediaviewer .s7videoplayer {
 background-color: transparent;
}

캡션은 비디오 플레이어 내부의 내부 컨테이너에 저장됩니다. 해당 컨테이너의 위치는 지원되는 WebVTT 위치 지정 연산자에 의해 제어됩니다. 캡션 텍스트 자체는 해당 컨테이너 내에 있으며, 해당 스타일은 다음 CSS 클래스 선택기로 제어됩니다.

.s7mixedmediaviewer .s7videoplayer .s7caption

캡션의 CSS 속성

예 - 반투명 검은색 배경에서 캡션 텍스트를 14픽셀 밝은 회색 Arial®로 설정하려면 다음을 수행하십시오.

.s7mixedmediaviewer .s7videoplayer .s7caption {
 background-color: rgba(0,0,0,0.75);
 color: #e6e6e6;
 font-weight: normal;
 font-size: 14px;
 font-family: Arial,Helvetica,sans-serif;
}

다음 CSS 클래스 선택기를 사용하여 버퍼링 애니메이션의 모양이 제어됩니다.

.s7mixedmediaviewer .s7videoplayer .s7waiticon

대기 아이콘의 CSS 속성

예 - 버퍼링 애니메이션을 폭 101픽셀, 높이 29픽셀로 설정하려면 다음을 수행합니다.

.s7mixedmediaviewer .s7videoplayer .s7waiticon {
 width: 101px;
 height: 29px;
 margin-left: -50px;
 margin-top: -15px;
 background-image: url(images/sdk/busyicon.gif);
}