뷰어는 원래 AEM Assets의 Dynamic Media에서 핫스팟이 작성된 위치의 기본 보기에 핫스팟 아이콘을 표시합니다.
기본 뷰어 영역의 CSS 속성
핫스팟 아이콘의 모양은 다음 CSS 클래스 선택기로 제어됩니다.
.s7carouselviewer .s7imagemapeffect .s7icon
CSS 속성 |
설명 |
---|---|
배경 이미지 |
핫스팟 아이콘 아트웍입니다. |
배경 위치 |
CSS 스프라이트를 사용하는 경우 아트워크 스프라이트 내부에 위치를 지정합니다. CSS 스프라이트 를 참조하십시오. |
width |
핫스팟 아이콘 너비. |
height |
핫스팟 아이콘 높이. |
예 - 두 개의 서로 다른 아이콘 상태에 대해 서로 다른 이미지를 표시하는 56 x 56 픽셀 핫스팟 아이콘을 설정합니다.
.s7interactiveimage .s7imagemapeffect .s7icon {
background-image: url(images/v2/imagemap/ImageMapEffect_icon1_light_up_touch.png);
width: 56px;
height: 56px;
}
.s7interactiveimage .s7imagemapeffect .s7icon:hover {
background-image: url(images/v2/imagemap/ImageMapEffect_icon1_light_over_touch.png);
}
이미지 맵 영역의 CSS 속성
이미지 맵 영역의 모양은 다음 CSS 클래스 선택기로 제어됩니다.
.s7carouselviewer .s7imagemapeffect .s7region
CSS 속성 |
설명 |
---|---|
배경 |
이미지 맵 영역 채우기 색입니다. #RRGGBB , RGB(R,G,B) 또는 RGBA(R,G,B,A) 형식으로 이 색상을 지정합니다. |
배경색 |
이미지 맵 영역 채우기 색입니다. #RRGGBB , RGB(R,G,B) 또는 RGBA(R,G,B,A) 형식으로 이 색상을 지정합니다. |
경계 |
이미지 맵 영역 테두리 스타일입니다. 너비 단색 "로 지정해야 합니다. 여기서 너비 는 픽셀로 표현되고 색상 은 #RRGGBB , RGB(R,G,B) 또는 RR(R,G,B,A) <A13/> 로 설정됩니다. |
예 - 한 픽셀 검정색 테두리로 투명한 이미지 맵 영역을 설정합니다.
.s7carouselviewer .s7imagemapeffect .s7region {
border: 1px solid #000000;
background: RGBA(0,0,0,0);
}