표시기 설정 set-indicator

세트 표시기는 뷰어가 터치 디바이스에서 사용될 때 기본 견본 위에 렌더링되는 일련의 점입니다. 점을 사용하면 스크롤 단추를 사용할 수 없을 때 사용자가 썸네일 페이지를 탐색할 수 있습니다.

세트 표시기의 CSS 속성

다음 CSS 클래스 선택기를 사용하여 설정된 표시기 컨테이너의 모양이 제어됩니다.

.s7mixedmediaviewer .s7setindicator
CSS 속성
설명
background-color
설정 표시기의 16진수 형식 배경색입니다.

예 - 흰색 배경에 세트 표시기를 만들려면:

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

개별 세트 표시기 점의 모양은 CSS 클래스 선택기를 사용하여 제어됩니다.

.s7mixedmediaviewer .s7setindicator .s7dot

CSS 속성
설명
width
설정된 표시기 점의 폭입니다.
height
설정된 표시점의 높이입니다.
왼쪽 여백
왼쪽 여백(픽셀).
여백-상단
상단 여백(픽셀).
오른쪽 여백
오른쪽 여백(픽셀 단위).
여백-하단
아래 여백(픽셀).
border-radius
테두리 반경(픽셀).
background-color
16진수 형식의 배경색입니다.
NOTE
표시기 점을 설정하면 state 속성 선택기: 다른 썸네일 상태에 다른 스킨을 적용하는 데 사용할 수 있습니다. 특히, state="selected" 은 현재 썸네일 페이지에 해당합니다. state="unselected" 는 기본 점 상태에 해당합니다.

예 - 2개의 픽셀 가로 여백, 5개의 픽셀 위쪽 여백, 1개의 픽셀 아래쪽 여백, 12개의 픽셀 반경, 기본 색상 및 #939393 활성 색상을 사용하여 15x15 픽셀#D5D3D3 설정된 표시점을 만들려면 다음 작업을 수행하십시오.

.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