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 nos locais em que 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

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

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 seletor de atributos state, 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ólida cor , onde largura é expressa em pixels e cor é definido #RRGGBB, RGB(R,G,B) ou RGBA(R,G,B,A).

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

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

Nesta página