イメージマップ内にイメージマップを置くことはできますか？（JavaScript）？

たとえば、画像1の特定のピクセルをクリックすると、画像2が表示されます。ここで、画像2の特定のピクセルをクリックして画像3を表示させるにはどうすればよいですか？すでに存在している画像のマップは1つしかないようです。イメージマップ内にイメージマップを置くことはできますか？（JavaScript）？

出典

2016-06-30 ML STEIN

あなたはすでに試したかを示すために、任意のコード例はありますか？ –

はい、ここにリンクされています：http://textuploader.com/53bpl –

マップを別のマップに埋め込むことはできません。

しかし、あなたが探しているものなら、コンテナを別のマップに置き換えることができます。ここに更新されたコードがあり、キーマップは現在のマップを次のマップに置き換える機能です。

document.getElementById（ 'topImageMap'）。setAttribute（ "usemap"、 "Presets"）;

それで、別の要素&を追加して、以前のまたは 'home'マップに戻ることが簡単になります。

<!DOCTYPE html> 
 
<html> 
 
<body> 
 
<img id="LivePreview" 
 
src="http://i.imgur.com/p5LwjWA.png"> 
 
<br></br> 
 

 
<img id="topImageMap" 
 
src="http://i.imgur.com/vU7VZ4V.png" usemap="Patterns"> 
 

 
<img id="WhiteSpace" 
 
src=http://i.imgur.com/jf7wt2j.png> 
 

 
<map name="Patterns"> 
 

 
    <area alt="PresetsButton" coords="18,21,94,80" onclick="changeContainer()" shape="rect" usemap="Presets"></area> 
 

 
    <area alt="RandomButton" coords="200,21,297,83" onclick="document.getElementById('WhiteSpace').src='http://i.imgur.com/Raypdtk.png'" shape="rect"></area> 
 

 
</map> 
 

 

 
<map name="Presets"> 
 

 
    <area alt="PuffnairbeadButton" coords="58,26,153,95" onclick="document.getElementById('LivePreview').src='http://i.imgur.com/DjbAdnh.png'" shape="rect"></area> 
 

 
</map> 
 

 
<script> 
 
    function changeContainer(){ 
 
    document.getElementById('topImageMap').setAttribute("usemap","Presets"); 
 
document.getElementById('topImageMap').src='http://i.imgur.com/wyQMR51.png' 
 
    } 
 
</script> 
 
</body> 
 
</html>

出典

2016-07-08 16:36:41

イメージマップ内にイメージマップを置くことはできますか？ （JavaScript）？

答えて

関連する問題

イメージマップ内にイメージマップを置くことはできますか？（JavaScript）？