Imagemap-Effekt image-map-effect
Abhängig vom Wert des Modusparameters zeigt der Viewer Imagemap-Symbole über der Hauptansicht an Orten an, an denen Karten ursprünglich in Dynamic Media Classic erstellt wurden, oder rendert exakte Regionen, die der Form von Originalbildkarten entsprechen.
CSS-Eigenschaften des Haupt-Viewer-Bereichs
Das Erscheinungsbild des Imagemap-Symbols wird mit dem folgenden CSS-Klassenselektor gesteuert:
.s7ecatalogsearchviewer .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.
.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;
}
Siehe auch Unterstützung von Imagemaps.
Das Erscheinungsbild des Imagemap-Bereichs wird mit dem folgenden CSS-Klassenselektor gesteuert:
.s7ecatalogsearchviewer .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:
.s7ecatalogsearchviewer .s7imagemapeffect .s7region {
border: 1px solid #000000;
background: RGBA(0,0,0,0);
}