Dependendo do valor do parâmetro de modo, o visualizador exibe ícones de mapa de imagem sobre a visualização principal em locais onde os mapas são originalmente criados no Dynamic Media Classic ou renderiza regiões exatas que correspondem à forma dos mapas de imagem originais.
Propriedades de CSS da área do visualizador principal
A aparência do ícone do mapa de imagem é controlada com o seguinte seletor de classe CSS:
.s7ecatalogsearchviewer .s7imagemapeffect .s7icon
A classe s7mapoverlay
CSS usada para estilizar ícones de mapa de imagem no passado agora está obsoleta; em vez disso, use s7icon
.
Propriedade CSS |
Descrição |
---|---|
background-image |
Arte-final do ícone do mapa de imagens. |
posição de fundo |
Posição dentro da sprite de arte, se os sprites CSS forem usados. Consulte também CSS Sprites . |
width |
Largura do ícone do mapa de imagens em pixels. |
altura |
Altura do ícone do mapa de imagens em pixels. |
O ícone do mapa de imagens suporta o seletor de atributos state
, que você pode usar para aplicar diferentes capas aos estados de ícones de default
e active
.
Exemplo - configure um ícone de mapa de imagem de 28 x 28 pixels que exiba uma imagem diferente para cada um dos dois estados de ícone diferentes.
.s7ecatalogsearchviewer .s7imagemapeffect .s7icon {
height: 28px;
width: 28px;
background-image: url(images/v2/ImageMapEffect_dark_up.png);
}
.s7ecatalogsearchviewer .s7imagemapeffect .s7icon[state="default"] {
opacity: 0.5;
}
.s7ecatalogsearchviewer .s7imagemapeffect .s7icon[state="active"] {
opacity: 1;
}
Consulte também Suporte ao mapa de imagens.
A aparência da região do mapa de imagem é controlada com o seguinte seletor de classe CSS:
.s7ecatalogsearchviewer .s7imagemapeffect .s7region
Propriedade CSS |
Descrição |
---|---|
fundo |
Cor de preenchimento da região do mapa de imagem. Especificado no formato #RRGGBB, RGB(R,G,B) ou RGBA(R,G,B,A). |
cor de fundo |
Cor de preenchimento da região do mapa de imagem. Especificado no formato #RRGGBB, RGB(R,G,B) ou RGBA(R,G,B,A). |
fronteira |
Estilo da borda da região do mapa de imagens. Especificado como largura sólida cor , em que largura é expresso em pixels e cor é definido como #RRGGBB, RGB(R,G,B) ou RGBA(R,G,B,A). |
Exemplo - configure uma região transparente do mapa de imagem com 1
borda preta de pixel :
.s7ecatalogsearchviewer .s7imagemapeffect .s7region {
border: 1px solid #000000;
background: RGBA(0,0,0,0);
}