javascript - HTML地图标签以及js maphilight停止工作
问题描述
我正在制作一个网页并在其中使用地图标签。我的区域坐标是正确的,但由于某种原因它不起作用。我也使用了maphilight
不能正常工作的库。此外,具有不同坐标的相同代码适用于我使用的不同图像,但现在不是。这是我的html代码:
<div class="col-md-12">
<img src="/static/Images/Mosaic.png" alt="mosaic" usemap="mosaicMap" id="mosaicImg">
<map name="mosaicMap">
<area shape="rect" coords="0,0,100,100" onclick="selectImage(1)">
<area shape="rect" coords="100,0,200,100" onclick="selectImage(2)">
<area shape="rect" coords="200,0,300,100" onclick="selectImage(3)">
<area shape="rect" coords="0,100,100,200" onclick="selectImage(4)">
<area shape="rect" coords="100,100,200,200" onclick="selectImage(5)">
<area shape="rect" coords="200,100,300,200" onclick="selectImage(6)">
<area shape="rect" coords="0,200,100,300" onclick="selectImage(7)">
<area shape="rect" coords="100,200,200,300" onclick="selectImage(8)">
<area shape="rect" coords="200,200,300,300" onclick="selectImage(9)">
</map>
</div>
我的图像是 300 x 300 px 单击该区域时未调用该函数。这是我的 js 代码maphilight
:
$(function() {
$('#mosaicImg').maphilight();
});
这是调用的函数:
function selectImage(imageNumber) {
console.log("here");
imageNum = imageNumber;
inputImage.src = "/static/Images/Mosaic" + imageNum.toString() + ".png";
laterNextText();
}
请帮我确定我哪里错了。
解决方案
推荐阅读
- php - 如何在 html 电子邮件中正确嵌入图像
- ruby-on-rails - Aws Rekognition Text detect
- python - How do I parse multiple files in Python and extract important information?
- c# - 日期从角度错误地转换为 Web api 控制器
- windows - 通过 Powershell 更改文件的文件权限
- react-native - 如何在 Expo 上使用 VSCode 调试 React Native?
- google-cloud-platform - Kubernetes Engine Cloud SQL proxy Lost connection to MySQL server at 'reading initial communication packet'
- python - 如果给定一个初始化类为 PyObject,则从 C++ 调用 Python 类方法
- python - simple web scraper very slow
- json - jMeter:JSON 断言