画像マップのサポート

eCatalogビューアでは、メイン表示の上にある画像マップアイコンのレンダリングがサポートされています。

マップアイコンの外観は、画像マップ効果で説明されているように、CSSを通じて制御されます。

画像マップは、次の3つの操作のいずれかを実行します。外部Webページ、情報パネルのポップアップアクティベーション、内部ハイパーリンクにリダイレクトします。

外部Webページにリダイレクト

画像マップのhref属性には、外部リソースへのURLが含まれます。このURLは、明示的に指定するか、サポートされているJavaScriptテンプレート関数の1つに含めます。loadProduct()loadProductCW()、およびloadProductPW()

以下は、単純なURLリダイレクトの例です。

href=http://www.adobe.com

この例では、同じURLがloadProduct()関数で囲まれます。

href=javascript:loadProduct("http://www.adobe.com");void(0);

画像マップのHREF属性にJavaScriptコードを追加すると、そのコードはクライアントのコンピューター上で実行されます。 したがって、JavaScriptコードが安全であることを確認してください。

情報パネルポップアップアクティベーション

情報パネルを操作するために、画像マップにはROLLOVER_KEY属性が設定されています。 また、href属性を同時に設定します。そうしないと、外部URL処理が情報パネルポップアップアクティベーションに干渉します。

最後に、ビューア設定にInfoPanelPopup.templateパラメーターとInfoPanelPopup.infoServerUrlパラメーターの適切な値が含まれていることを確認します。

メモ

情報パネルポップアップを設定する場合、情報パネルに渡されるHTMLコードとJavaScriptコードは、クライアントのコンピューター上で実行されます。 したがって、このようなHTMLコードとJavaScriptコードが安全であることを確認してください。

内部ハイパーリンク

画像マップをクリックすると、ビューア内で内部ページの入れ替えが実行されます。 この機能を使用するために、画像マップのhref属性は次の特殊な形式を持ちます。

href=target: *idx*

*idx*は、カタログ見開きの0を基準とするインデックスです。

eCatalog内の3D見開きを指す画像マップのhref属性の例を次に示します。

href=target:2

このページ

Adobe Summit Banner

A virtual event April 27-28.

Expand your skills and get inspired.

Register for free
Adobe Summit Banner

A virtual event April 27-28.

Expand your skills and get inspired.

Register for free
Adobe Maker Awards Banner

Time to shine!

Apply now for the 2021 Adobe Experience Maker Awards.

Apply now
Adobe Maker Awards Banner

Time to shine!

Apply now for the 2021 Adobe Experience Maker Awards.

Apply now