jquery - 如何将 jquery maphilight 居中对齐？

Question

是的，我知道这个问题是多么愚蠢和愚蠢，但我一直在四处寻找，但我找不到如何对齐图像以便我可以将其放置在中间 for the excellent jquery maphilight ，我发现将 class="map"应用于图像后，它会自动向左移动。

我也可以找到任何设置位置的选项。请帮忙。谢谢!!

Answer 1

它发生变化的原因是该插件在 IMG 周围包裹了一个 div 以包含 canvas 元素以及图像。如果它在所有浏览器中创建相同或相似的标记(我在 Safari 和 Firefox 中测试了这一点)，那么这应该可以满足您的要求:

$('.map').maphighlight().parent().addClass('center-map');

这会将 .center-map 类添加到动态创建的父 div 中。为了使居中工作，我必须将 div 的宽度设置为与图像相同的宽度(否则它会占用尽可能多的水平空间，使其无法居中)。以下是我在测试时使用的 CSS 规则:

.center-map {
    margin: 0 auto;
    width: 420px;
}