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