Hotspots und Imagemaps hotspots-and-image-maps
Der Viewer zeigt Hotspot-Symbole über der Hauptansicht an Orten an, an denen Hotspots ursprünglich in Dynamic Media von AEM Assets - On-Demand - erstellt wurden.
CSS-Eigenschaften des Haupt-Viewer-Bereichs
Das Erscheinungsbild des Hotspot-Symbols wird mit der folgenden CSS-Klassenauswahl gesteuert:
.s7carouselviewer .s7imagemapeffect .s7icon
Position innerhalb des Bildsprites, wenn CSS-Sprites verwendet werden.
Siehe CSS-Sprites.
Beispiel: Richten Sie ein Hotspot-Symbol mit 56 x 56 Pixel ein, das für jeden der beiden Symbolstatus ein anderes Bild anzeigt:
.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);
}
CSS-Eigenschaften des Imagemap-Bereichs
Das Erscheinungsbild des Imagemap-Bereichs wird mit der folgenden CSS-Klassenauswahl gesteuert:
.s7carouselviewer .s7imagemapeffect .s7region
Füllfarbe für Imagemap-Bereich.
Geben Sie diese Farbe in den Formaten #RRGGBB , RGB(R,G,B) oder RGBA(R,G,B,A) an.
Füllfarbe für Imagemap-Bereich.
Geben Sie diese Farbe in den Formaten #RRGGBB , RGB(R,G,B) oder RGBA(R,G,B,A) an.
Beispiel: Richten Sie einen transparenten Imagemap-Bereich mit einem schwarzen Rahmen von einem Pixel ein:
.s7carouselviewer .s7imagemapeffect .s7region {
border: 1px solid #000000;
background: RGBA(0,0,0,0);
}