아이콘 효과

확대/축소 표시기가 기본 보기 영역에 겹쳐집니다. 이미지가 재설정 상태일 때 표시되며, 아이콘 효과 매개 변수에도 달라집니다.

기본 뷰어 영역의 CSS 속성

보기 영역의 모양은 다음 CSS 클래스 선택기로 제어됩니다.

.s7basiczoomviewer .s7zoomview .s7iconeffect

CSS 속성

설명

배경 이미지

돋보기 표시기 아트웍입니다.

배경 위치

CSS 스프라이트를 사용하는 경우 아트워크 스프라이트 내부에 위치를 지정합니다.

CSS Sprite 를 참조하십시오.

width

확대/축소 표시기 너비.

height

확대/축소 표시기 높이.

노트

아이콘 효과는 media-type 속성 선택기를 지원하며, 이 선택기를 사용하여 다른 장치에 다른 아이콘 효과를 적용할 수 있습니다. 특히 media-type='standard'은 마우스 입력이 일반적으로 사용되는 데스크톱 시스템에 해당하고, media-type='multitouch'은 터치 입력이 있는 장치에 해당합니다.

예 - 데스크톱 시스템 및 터치 장치용 다양한 기능의 100 x 100 픽셀 확대/축소 표시기를 설정하려면 다음을 수행하십시오.

.s7basiczoomviewer .s7zoomview .s7iconeffect { 
 width: 100px; 
 height: 100px; 
} 
.s7basiczoomviewer .s7zoomview .s7iconeffect[media-type='standard'] { 
 background-image:url(images/v2/IconEffect_zoom.png); 
} 
.s7basiczoomviewer .s7zoomview .s7iconeffect[media-type='multitouch'] { 
 background-image:url(images/v2/IconEffect_pinch.png); 
}

이 페이지에서는