Центрирование img по горизонтали и вертикали с помощью JQuery

Question

Я пытаюсь центрировать логотип этой марки вертикально и горизонтально на всей странице с помощью JQuery. Это делает работа на браузере изменение размера но не изначально. Внимание: этот код изменяет размер изображения, чтобы он соответствовал странице. Я попытался $ (окно) и $ (документ) JS является:

$(function() { 
    var resizeToFit = function(){ 
     var $this = $(document); 
     var imgw = $("#overlay-logo img").width(); 
     var pw = $this.width(); 
     var $overlaylogo = $("#overlay-logo img"); 
     $overlaylogo.css("width", pw - 100); 
     var left = (pw/2) - (imgw/2); 
     $overlaylogo.css('margin-left',left); 
    } 
    $(window).resize(function(){ 
     resizeToFit(); 
    }); 
    resizeToFit(); 
}); 

CSS:

#overlay-logo{ 
position:absolute; 
top:50%; 
z-index: 999999; 
} 

HTML:

<div id="overlay-logo"> 
    <img src="img/overlay.png" alt="overlay" /> 
</div> 

Answer 1

вы должны быть в состоянии сделать это только с прямой CSS.

#overlay-logo{  
    height:99%; 
    width:99%; 
    margin:auto; 
    position:absolute; 
    top:0; 
    right:0; 
    left:0; 
    bottom:0; 
} 

вот скрипку: http://jsfiddle.net/GheZd/

EDIT Просто сделайте высоту и ширину 99% тогда. Вы можете применить этот стиль непосредственно к изображению ... вам необязательно нужен div.