如何縮放圖像的中心？

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%);