悬停并选择图像贴图的状态

Hover and selected state for an image map

本文关键字：状态 图像 选择 悬停      更新时间：2023-09-26

嗨，这是我的代码：

<img id="body_image" usemap="#body_map" src="assets/images/body.jpg" alt="">
<map name="body_map">
   <area shape="poly" alt="d" href="#body_chart" name="ad" coords="153, 153, 145, 164, 150, 175, 163, 165, 163, 157" />
</map>

现在我需要为地图区域添加一个悬停和选定状态。此外，我想做更多的区域和多重选择在一次。

现在，你能帮我写悬停和选定状态的完整代码吗。

这里有一个JQuery版本：

$(document).ready(function() {
    if($('#location-map')) {
        $('#location-map area').each(function() {
            var id = $(this).attr('id');
            $(this).mouseover(function() {
                $('#overlay'+id).show();
            });
            $(this).mouseout(function() {
                var id = $(this).attr('id');
                $('#overlay'+id).hide();
            });
        });
    }
});

希望这能有所帮助！：）

相关文章：