Efeito do mapa de imagem

Dependendo do valor do parâmetro de modo, o visualizador exibe ícones de mapa de imagem sobre a exibição principal em lugares 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 CSS da área principal do visualizador

A aparência do ícone do mapa de imagem é controlada com o seguinte seletor de classe CSS:

.s7ecatalogsearchviewer .s7imagemapeffect .s7icon
OBSERVAÇÃO

O s7mapoverlay A classe CSS usada para criar ícones de mapa de imagem no passado agora está obsoleta; use s7icon em vez disso.

Propriedade CSS

Descrição

imagem de fundo

Arte do ícone do mapa de imagem.

posição de fundo

Posição dentro da estrutura de arte, se os sprites CSS forem usados.

Consulte também Sprites CSS .

width

Largura do ícone do mapa de imagem em pixels.

altura

Altura do ícone do mapa de imagem em pixels.

OBSERVAÇÃO

O ícone do mapa de imagem é compatível com o state seletor de atributos, que pode ser usado para aplicar capas diferentes aos estados de ícones de default e active.

Exemplo - configure um ícone de mapa de imagem de 28 x 28 pixels que exibe 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 imagem.

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 do 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).

border

Estilo da borda da região do mapa de imagem.

Especificado como largura sólido color , onde largura é expresso em pixels e color é definido como #RRGGBB, RGB(R,G,B) ou RGBA(R,G,B,A).

Exemplo - configurar uma região do mapa de imagem transparente com 1 borda preta pixel :

.s7ecatalogsearchviewer .s7imagemapeffect .s7region {
 border: 1px solid #000000;
 background: RGBA(0,0,0,0);
}

Nesta página