Question

我尝试使用JavaScript创建image preview effect，以打开以全屏模式点击的所有图片。图像本身使用以下代码根据其大小居中。

position: fixed;
top: 50%;
left: 50%;

简化的Javascript | See All | Result

el.style.margin = "-" + el.height / 2 + "px -" + el.width / 2 + "px";

Firefox中的代码functions properly，但在Webkit浏览器中，图像被推入左上角并且具有模糊的负边距。为什么这个Javascript在Webkit浏览器中不起作用？我该如何修复此代码？

Answer 1

popupImage.style.margin = "-" + popupImage.clientHeight / 2 
    + "px -" + popupImage.clientWidth / 2 + "px";