Effet de zone cliquable

En fonction de la valeur du paramètre de mode, la visionneuse affiche les icônes de zone cliquable sur la vue principale aux endroits où les zones cliquables sont créées à l’origine dans Dynamic Media Classic ou effectue le rendu des zones exactes qui correspondent à la forme des zones cliquables d’origine.

Propriétés CSS de la zone de visualisation principale

L’aspect de l’icône de zone cliquable est contrôlé par le sélecteur de classe CSS suivant :

.s7ecatalogsearchviewer .s7imagemapeffect .s7icon
REMARQUE

La classe CSS s7mapoverlay utilisée dans le passé pour mettre en forme les icônes de zone cliquable est désormais obsolète ; utilisez plutôt s7icon.

Propriété CSS

Description

image d’arrière-plan

Illustration de l’icône de zone cliquable.

arrière-plan-position

Positionnez l’objet à l’intérieur de l’objet d’illustration, si des sprites CSS sont utilisés.

Voir aussi CSS Sprites .

width

Largeur de l’icône de zone cliquable en pixels.

height

Hauteur de l’icône de zone cliquable en pixels.

REMARQUE

L’icône de zone cliquable prend en charge le sélecteur d’attributs state, que vous pouvez utiliser pour appliquer différents habillages aux états d’icône default et active.

Exemple : configurez une icône de zone cliquable de 28 x 28 pixels qui affiche une image différente pour chacun des deux états d’icône différents.

.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; 
}

Voir aussi Prise en charge des zones cliquables.

L’aspect de la région de zone cliquable est contrôlé par le sélecteur de classe CSS suivant :

.s7ecatalogsearchviewer .s7imagemapeffect .s7region

Propriété CSS

Description

arrière

Couleur de remplissage de la zone de zone cliquable.

Spécifié au format #RRGGBB, RGB(R,G,B) ou RGBA(R,G,B,A).

arrière-plan-couleur

Couleur de remplissage de la zone de zone cliquable.

Spécifié au format #RRGGBB, RGB(R,G,B) ou RGBA(R,G,B,A).

bordure

Style de bordure de la zone de zone de zone cliquable.

Spécifié comme largeur pleine couleur , où largeur est exprimé en pixels et couleur est défini comme #RRGGBB, RGB(R, G, B) ou RGBA(R, G, B, A).

Exemple : configurez une région transparente de zone cliquable avec une bordure noire de 1 pixel :

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

Sur cette page