Question

我有一个图像使用包裹在div中的imagemapster，但div不会出于某种原因而居中。如果我删除所有JS代码，div中心，所以这肯定是由于图像映射器的东西。

这很简单，只是：

<div class="chartmap">
    <img id="waterfall" align="middle" src="http://i1372.photobucket.com/albums/ag358/rls462/waterfall_zpsdd7cc432.png" usemap="#water" alt="Waterfall Methodology Map">
    <map name="water">
        <area ......>

         ...
    </map>
</div>

这是演示：http://jsfiddle.net/stamblerre/t6K8X/13/

有什么想法？感谢!!!!

Answer 1

在img元素上初始化Mapster时，jQuery使用默认情况下左对齐的动态容器包装图像。
您可能希望将动态容器重新对齐到中心：

$('#waterfall')是您的图片，因此要访问包装容器，您需要致电$('#waterfall').parent() 然后对齐它：.css({"margin":"0 auto"})

JS：

$(document).ready(function () {
     $('#waterfall').mapster({
         singleSelect: true,
         clickNavigate: true,
         scaleMap: false,
         fill: false,
         stroke: true,
         strokeColor: '000080',
         strokeWidth: 3,
         mapKey: 'data-name',
     }).parent().css({"margin":"0 auto"});
 });

这是你固定的 Fiddle

以ImageMapster为中心

1 个答案: