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