javascript - 如何放大图像的中心？

Question

我想知道如何放大图像的中心。

我尝试了不同的东西，例如imageWrapper.width().left

$(document).on('click', '.process-diagram-zoom-in', function(){
    var div = $(this).parents('.container-fluid:first');
    var imageWrapper = div.find('.image-wrapper');
    imageWrapper.width(imageWrapper.width() * 5.1);
});

Answer 1

显然，您已经知道如何放大图像，因此您需要做的是确保它在容器内居中。

这可以通过简单的 CSS 来完成。

对于容器:

position: relative;

对于图像:

position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);