Zones réactives et zones cliquables hotspots-and-image-maps
La visionneuse affiche des icônes de zone réactive sur la vue principale aux endroits où les zones réactives ont été créées à l’origine dans Dynamic Media d’AEM Assets – à la demande.
Propriétés CSS de la zone principale de la visionneuse
L’apparence de l’icône de zone réactive est contrôlée par le sélecteur de classe CSS suivant :
.s7carouselviewer .s7imagemapeffect .s7icon
Position à l’intérieur du sprite de l’illustration, si des sprites CSS sont utilisés.
Voir SpritesCSS.
Exemple : configurez une icône de zone réactive de 56 x 56 pixels qui affiche une image différente pour chacun des deux états d’icône :
.s7interactiveimage .s7imagemapeffect .s7icon {
background-image: url(images/v2/imagemap/ImageMapEffect_icon1_light_up_touch.png);
width: 56px;
height: 56px;
}
.s7interactiveimage .s7imagemapeffect .s7icon:hover {
background-image: url(images/v2/imagemap/ImageMapEffect_icon1_light_over_touch.png);
}
Propriétés CSS de la région de zone cliquable
L’aspect de la zone de zone cliquable est contrôlé par le sélecteur de classe CSS suivant :
.s7carouselviewer .s7imagemapeffect .s7region
Couleur de remplissage de zone cliquable.
Spécifiez cette couleur aux formats #RRGGBB , RGB(R,G,B) ou RGBA(R,G,B,A).
Couleur de remplissage de zone cliquable.
Spécifiez cette couleur aux formats #RRGGBB , RGB(R,G,B) ou RGBA(R,G,B,A).
Exemple - Configurez une zone de zone cliquable transparente avec une bordure noire d’un pixel :
.s7carouselviewer .s7imagemapeffect .s7region {
border: 1px solid #000000;
background: RGBA(0,0,0,0);
}