Question

我使用基本的map和area标签创建了一张图片地图。我已经测试了地图，并且所有区域的行为都符合预期，因此HTML绝对是正确的。

我现在正在尝试使用JQuery在悬停和/或点击它们时根据不同区域更改地图（源）的图像。这样我就希望得到一种互动的＆＃39;地图，显示地图上不同的地方是如何连接的。
我定义的所有区域都有唯一的ID。

这是我用于点击版本的脚本：

$(document).ready(function() {
    $('#area1').click(function() {
        $('#londonmap').css('src', 'area1map.png');
    });
});

#area id名称根据悬停的区域而变化，而#londonmap one则是用作地图的图像的ID，其来源需要根据您悬停/点击的区域进行更改

我不是JQuery专家，所以我需要问 - 我做错了什么？

Answer 1

'src'不是css属性，但它是<img>标记的属性。

$(document).ready(function() {
    $('#area1').click(function() {
        $('#londonmap').attr('src', 'area1map.png');
    });
});

Answer 2

您正尝试使用jQuery的$.css()方法更改图像源。虽然图像的源不是用CSS设置的，但它是图像本身的属性。因此，您应该使用$.attr()来修改此值：

$("#londonmap").attr("src", "area1map.ong");