전체 화면 높이를 유지하면서 이미지를 가운데에 맞 춥니 다.

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

뭔가를? (이 질문의 솔루션에서 영감 : link)

JsFiddle

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

어떤 이유