影像地圖效果

根據mode參數的值，在原本以Dynamic Media Classic製作地圖的地方，檢視器會在主檢視上顯示影像地圖圖示，或呈現與原始影像地圖形狀相符的確切區域。

主查看器區域的CSS屬性

使用下列CSS類選擇器控制影像映射表徵圖的外觀：

.s7ecatalogsearchviewer .s7imagemapeffect .s7icon
注意

此 s7mapoverlay 過去用來設定影像地圖圖示樣式的CSS類別現已過時；use s7icon 。

CSS屬性

說明

背景 — 影像

影像地圖表徵圖圖。

背景位置

如果使用CSS精靈，則位於圖稿精靈內。

另請參閱 CSS Sprite .

width

影像地圖圖示寬度（像素）。

height

影像地圖圖示高度（像素）。

注意

影像地圖圖示支援 state 屬性選取器，您可使用它將不同的外觀套用至的圖示狀態 default 和 active.

範例：設定28 x 28像素的影像地圖圖示，以針對兩個不同圖示狀態中的每一個顯示不同影像。

.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;
}

另請參閱 影像地圖支援.

影像映射區域的外觀由以下CSS類選擇器控制：

.s7ecatalogsearchviewer .s7imagemapeffect .s7region

CSS屬性

說明

背景

影像映射區域填充顏色。

在#RRGGBB、RGB(R、G、B)或RGBA(R、G、B、A)格式中指定。

背景顏色

影像映射區域填充顏色。

在#RRGGBB、RGB(R、G、B)或RGBA(R、G、B、A)格式中指定。

border

影像映射區域邊框樣式。

指定為 寬度 固體 色彩 ，其中 寬度 以像素表示， 色彩 設定為#RRGGBB、RGB(R,G,B)或RGBA(R,G,B,A)。

示例 — 使用 1 像素黑色邊框：

.s7ecatalogsearchviewer .s7imagemapeffect .s7region {
 border: 1px solid #000000;
 background: RGBA(0,0,0,0);
}

本頁內容