css - jquery zoom IE7 css绝对定位错误

Question

我正在使用 JQuery plug-in for image zoom ，在IE7下不能正常使用，缩放图像的位置不同。

在 Firefox 中:

在 IE7 中

<span class="zoom" style="position: relative; overflow: hidden;">
<img  width="100px" height="100px" src="../gallery/sample/pic.jpg">
<img class="zoomImg" src="../gallery/sample/pic.jpg" style="position: absolute; top: -321px; left: -277.5px; opacity: 0; width: 420px; height: 336px; border: medium none; max-width: none;">
</span>


.zoom{display:inline-block,margin:10px;}
.zoomImg{z-index:5;}

Answer 1

display:inline-block CSS 语句将元素显示为内联级 block 容器。这个 block 的内部被格式化为 block 级框，元素本身被格式化为行内框。尝试解决这个问题，这是 IE7 和更早版本中具有此属性的已知错误。

还有一件事，如插件网站上所述:兼容:Chrome、Firefox、Safari、Opera、Internet Explorer 7+ 中的 jQuery 1.7+。所以，显然是插件适用于 IE7 以上的浏览器。