image - 在保持全屏高度的同时居中图像

Question

即使窗口变小，我也希望图像保持浏览器窗口的整个高度。这似乎可以解决问题。但是，目前，图像仍然锚定在屏幕的左侧，而图像的右侧是随着窗口大小调整而丢失的。相反，我希望图像从两侧切开，留下居中的图像。这可能吗？

注意：我需要 div 中的图像，而不是设置为背景。

谢谢！

这是我目前正在使用的 CSS：

.div
        {
        min-height:100%;
        min-width:100%;
        text-align:center;
        overflow: hidden;
        margin: 0 auto;
        }
.img
        {
        min-height:100%;
        min-width:100%;
        margin: 0 auto;
        }

Answer 1

像这样的东西？

var origWidth;
$(document).ready(function() {
    origWidth = $(window).width();  //store the window's width when the document loads
    origHeight = $(window).height();  //store the window's width when the document loads
});

$(window).resize(function() {
    var curWidth = $(window).width(); //store the window's current width
    var curHeight = $(window).width(); //store the window's current height
    var deltaTop = (curWidth- origWidth);
     var deltaLeft = (curHeight- origHeight);
    $("#image1").offset({top:($("#image1").offset().top + deltaTop)});
     $("#image1").offset({left:($("#image1").offset().top + deltaLeft)});
    origWidth = curWidth;
    origHeight =curHeight;
});

提琴手

（受此问题解决方案的启发：链接）