引导程序中响应图像的图像映射坐标不能正常工作?

时间:2014-10-30 12:01:49

标签: javascript jquery html twitter-bootstrap imagemap

的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)链接根本不工作。如果我删除插件链接工作正常但不是在所有设备..任何人都知道什么是这个解决方案??谢谢提前..

0 个答案:

没有答案