的index.html
<div class="carousel-inner" >
<div class="item active" data-slide-number="0">
<img src="resources/images/banners1.png" border="0" usemap="#Map" class="fill img-responsive">
<map name="Map">
<area shape="rect" style="outline:none;" coords="150,209,298,317" id="slidepopup" href="#" />
<area shape="rect" style="outline:none;" coords="324,209,473,315" href="requestDemo.html" />
<area shape="rect" style="outline:none;" coords="500,210,648,314" href="downloadtrailversion.html" />
<area shape="rect" style="outline:none;" coords="557,416,696,466" href="banner1content.html" />
</map>
</div>
<div class="item" data-slide-number="1">
<img src="resources/images/banners2.png" border="0" usemap="#Map2" class="fill img-responsive">
<map name="Map2">
<area shape="rect" style="outline:none;" coords="557,416,696,466" href="platformoncloud.html" />
</map>
</div>
<div class="item" data-slide-number="2">
<img src="resources/images/banners3.png" border="0" usemap="#Map3" class="fill img-responsive"/>
<map name="Map3"><area shape="rect" style="outline:none;" coords="462,394,601,433" href="visualanalytics.html" /></map>
</div>
</div>
Jquery的:
https://github.com/stowball/jQuery-rwdImageMaps
Jquery方法调用:
$(document).ready(function(e) {
$('img[usemap]').rwdImageMaps();
});
在上面的代码响应图像映射链接不工作..所以我使用了一些插件,所以它为我的桌面,iPAD,移动设备的第一个图像(banners1.png)工作。但对于第二个(banners2.png)和第三个图像(banners2.png)链接根本不工作。如果我删除插件链接工作正常但不是在所有设备..任何人都知道什么是这个解决方案??谢谢提前..