O visualizador exibe ícones de pontos de conexão sobre a visualização principal em lugares onde os pontos de conexão foram originalmente criados no Dynamic Media do AEM Assets - sob demanda.
Propriedades de CSS da área do visualizador principal
A aparência do ícone do ponto de conexão é controlada com o seguinte seletor de classe CSS:
.s7carouselviewer .s7imagemapeffect .s7icon
Propriedade CSS |
Descrição |
---|---|
background-image |
Arte-final do ícone de ponto de acesso. |
posição de fundo |
Posição dentro da sprite de arte, se os sprites CSS forem usados. Consulte sprites CSS . |
width |
Largura do ícone do ponto de acesso. |
altura |
Altura do ícone do ponto de acesso. |
Exemplo - configure um ícone de ponto de acesso de 56 x 56 pixels que exibe uma imagem diferente para cada um dos dois estados de ícone diferentes:
.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);
}
Propriedades de CSS da região do mapa de imagem
A aparência da região do mapa de imagem é controlada com o seguinte seletor de classe CSS:
.s7carouselviewer .s7imagemapeffect .s7region
Propriedade CSS |
Descrição |
---|---|
fundo |
Cor de preenchimento da região do mapa de imagem. Especifique essa cor nos formatos #RRGGBB , RGB(R,G,B) ou RGBA(R,G,B,A) . |
cor de fundo |
Cor de preenchimento da região do mapa de imagem. Especifique essa cor nos formatos #RRGGBB , RGB(R,G,B) ou RGBA(R,G,B,A) . |
fronteira |
Estilo da borda da região do mapa de imagens. Deve ser especificado como " largura cor sólida ", onde largura é expressa em pixels, e cor é definida como #RRGGBB , RGB(R,G,B) <a1 1/> ou RGBA(R,G,B,A) . |
Exemplo - configure uma região transparente do mapa de imagem com uma borda preta de um pixel:
.s7carouselviewer .s7imagemapeffect .s7region {
border: 1px solid #000000;
background: RGBA(0,0,0,0);
}