Question

我尝试将两个<map>添加到＆＃34; HomeNewProducts1.png＆＃34;但没有任何成功。两个<map>网址链接应该转到两个不同的目标网页。我是Javascript的新手。请帮助!!!谢谢！

<div>
<img src="images/NewProductsBox1.png" class="img-responsive" 
id="newProduct" onclick="changeImage()" 
onmouseover="this.src='images/NewProductsBoxOpen1.png';" 
onmouseout="this.src='images/NewProductsBox1.png'; map name="map1"/>
</div>

<map name="map1">
 <area href="function changeImage() {
    newProduct.src = "images/HomeNewProducts1.png";
    }" shape="circle" coords="240,180,140">
 <area href="function changeImage() {
    newProduct.src = "images/HomeNewProducts1.png";
    }" shape="rect" coords="4,6,88,69" href="#">
</map>

<script>
function changeImage() {
    newProduct.src = "images/HomeNewProducts1.png";
    }
</script>

Answer 1

好的 - 仍然试图绕过你想要完成的事情，如果这是最好的方法。我认为你过度复杂的区域标签。到目前为止，这是有效的，但我不确定它是否完全是您正在寻找的：

<div>
<img src="images/NewProductsBox1.png" class="img-responsive" 
id="newProduct" onclick="changeImage()" onmouseover="this.src='images/NewProductsBoxOpen1.png';" 
onmouseout="this.src='images/NewProductsBox1.png';" usemap="map1" />
</div>

<map name="map1">
 <area shape="circle" coords="240,180,140" href="http://www.yahoo.com" target="_blank" />
 <area shape="rect" coords="4,6,88,69" href="http://www.google.com" target="_blank" />
</map>

<script>
function changeImage() {
    newProduct.src = "images/HomeNewProducts1.png";
    }
</script>

如何将两个带有不同URL链接的<map>添加到<onclick>图像？

1 个答案: