Imagemap-Effekt image-map-effect
Je nach dem Wert des Modus -Parameters zeigt der Viewer Imagemap-Symbole über der Hauptansicht an den Stellen an, an denen Karten ursprünglich in Dynamic Media Classic erstellt wurden. Alternativ werden exakte Bereiche gerendert, die der Form der ursprünglichen Imagemaps entsprechen.
CSS-Eigenschaften des Haupt-Viewer-Bereichs
Das Erscheinungsbild des Imagemap-Symbols wird mit dem folgenden CSS-Klassenselektor gesteuert:
.s7ecatalogviewer .s7imagemapeffect .s7icon
s7mapoverlay
CSS-Klasse, die in der Vergangenheit zum Formatieren von Imagemap-Symbolen verwendet wurde, ist jetzt veraltet. Verwenden Sie stattdessen s7icon
.Positionieren Sie sie innerhalb des Bildsets, wenn CSS-Sprites verwendet werden.
Siehe auch CSS Sprites-.
state
-Attributauswahl, mit der Sie verschiedene Skins auf die Symbolstatus von default
und active
anwenden können.Beispiel: Richten Sie ein Imagemap-Symbol mit 28 x 28 Pixeln ein, das für jeden der beiden verschiedenen Symbolstatus ein anderes Bild anzeigt.
.s7ecatalogviewer .s7imagemapeffect .s7icon {
height: 28px;
width: 28px;
background-image: url(images/v2/ImageMapEffect_dark_up.png);
}
.s7ecatalogviewer .s7imagemapeffect .s7icon[state="default"] {
opacity: 0.5;
}
.s7ecatalogviewer .s7imagemapeffect .s7icon[state="active"] {
opacity: 1;
}
Siehe auch Unterstützung von Imagemaps.
Das Erscheinungsbild des Imagemap-Bereichs wird mit dem folgenden CSS-Klassenselektor gesteuert:
.s7ecatalogviewer .s7imagemapeffect .s7region
Füllfarbe des Imagemap-Bereichs.
Wird im Format #RRGGBB, RGB(R,G,B) oder RGBA(R,G,B,A) angegeben.
Füllfarbe des Imagemap-Bereichs.
Wird im Format #RRGGBB, RGB(R,G,B) oder RGBA(R,G,B,A) angegeben.
Rahmenstil der Imagemap-Region.
Wird angegeben als Breite einfarbigen , wobei Breite in Pixel ausgedrückt wird und Farbe als #RRGGBB, RGB(R,G,B) oder RGBA(R,G,B,A) eingestellt .
Beispiel : Richten Sie einen transparenten Imagemap-Bereich mit 1
Pixel schwarzem Rahmen ein:
.s7ecatalogviewer .s7imagemapeffect .s7region {
border: 1px solid #000000;
background: RGBA(0,0,0,0);
}