画像マップエフェクト image-map-effect
ビューアは、mode パラメーターの値に応じて、Dynamic Media Classicでマップが最初に作成された場所に画像マップアイコンをメインビューの上に表示したり、元の画像マップの形状に一致する正確な領域をレンダリングしたりします。
メインビューア領域の CSS プロパティ
画像マップアイコンの外観は、次の CSS クラスセレクターで制御します。
.s7ecatalogsearchviewer .s7imagemapeffect .s7icon
NOTE
過去に画像マップアイコンのスタイル設定に使用されていた
s7mapoverlay
CSS クラスは非推奨(廃止予定)になりました。代わりに s7icon
を使用します。CSS プロパティ
説明
background-image
画像マップ アイコン アートワーク。
background-position
幅
画像マップアイコンの幅(ピクセル単位)。
高さ
画像マップアイコンの高さ(ピクセル単位)。
NOTE
画像マップアイコンは、
state
属性セレクターをサポートしています。このセレクターを使用して、default
と active
のアイコン状態に異なるスキンを適用できます。例 – 28 x 28 ピクセルの画像マップアイコンを設定します。このアイコンは、2 つの異なるアイコン状態のそれぞれに異なる画像を表示します。
.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 プロパティ
説明
background
画像マップ領域の塗りつぶしの色。
#RRGGBB、RGB(R,G,B)または RGBA (R,G,B,A)のフォーマットで指定します。
の背景色の
画像マップ領域の塗りつぶしの色。
#RRGGBB、RGB(R,G,B)または RGBA (R,G,B,A)のフォーマットで指定します。
境界線
画像マップ領域の境界線のスタイル。
幅 単色 色 として指定します。 幅 はピクセルで表され、 色 は#RRGGBB、RGB(R,G,B)または RGBA (R,G,B,A)に設定されます。
例 – ピクセルの黒い境界線を持つ透明画像マップ領域 1
設定する
.s7ecatalogsearchviewer .s7imagemapeffect .s7region {
border: 1px solid #000000;
background: RGBA(0,0,0,0);
}
recommendation-more-help
b7426f53-aad9-4c00-83fc-664f30f681e8