画像マップのサポート

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

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

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

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

画像マップのhref属性には、外部リソースへの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

このページ