画像マップエフェクト image-map-effect

Last update: Mon Jul 22 2024 00:00:00 GMT+0000 (Coordinated Universal Time)

トピック：

作成対象：

開発者
ユーザー

mode パラメーターの値に応じて、ビューアは画像マップアイコンをDynamic Media Classicでマップが最初に作成された場所のメインビューに表示します。または、元の画像マップの形状に一致する正確な領域をレンダリングします。

メインビューア領域の CSS プロパティ

画像マップアイコンの外観は、次の CSS クラスセレクターで制御します。

.s7ecatalogviewer .s7imagemapeffect .s7icon

NOTE

過去に画像マップアイコンのスタイル設定に使用されていた s7mapoverlay CSS クラスは非推奨（廃止予定）になりました。代わりに s7icon を使用します。

CSS プロパティ

説明

background-image

画像マップアイコンアートワーク。

background-position

CSS スプライトを使用する場合、アートワークスプライト内に配置します。

CSS スプライトール参照してください。

幅

画像マップアイコンの幅（ピクセル単位）。

高さ

画像マップアイコンの高さ（ピクセル単位）。

NOTE

画像マップアイコンは、state 属性セレクターをサポートしています。このセレクターを使用して、default と active のアイコン状態に異なるスキンを適用できます。

例 – 28 x 28 ピクセルの画像マップアイコンを設定します。このアイコンは、2 つの異なるアイコン状態のそれぞれに異なる画像を表示します。

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

画像マップのサポートも参照してください。

画像マップ領域の外観は、次の CSS クラスセレクターで制御します。

.s7ecatalogviewer .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 設定する

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

recommendation-more-help

b7426f53-aad9-4c00-83fc-664f30f681e8