Center an image while keeping full screen height - image

Question

I want an image to remain the full height of the browser window even if the window is made smaller. This seems to do the trick. However, at current, the image remains anchored to the left side of the screen with the right side of the image being what is lost as the window resizes. Instead, I'd like the image to chop from both sides leaving a centered image. Is this possible?
Note: I need the image in a div, not set as background.
Thanks!
Here is the CSS I'm currently using:
.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

something like this ?
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;
});
JsFiddle
(inspired by this question's solution: link)