İndex resmini sayfaya ortalamak için ?

Merhabalar;

belki de çok basit bir sorunun cevabı ama işin içinden çıkamadım şu anda. İndex'e koyduğum boyutlarını kendimin belirlediği bir index resmi var arka plan olarak düşünün sayfaya ortalanmış bir şekilde. Fakat bu resim her çözünürlük ve her tarayıcıda farklı yerlerde çıkıyor. Yani kısaca çözünürlüğe ve tarayıcıya göre resim ya en sol üstte yada parça parça bitişik ekrana sığmış şekilde çıkıyor.

İsteğim ise şu hangi çözünürlük ve hangi tarayıcıda site açılır ise açılsın index resmi sayfayı tam ortalasın ..

Bunun için yapmam gereken şey ne acaba çözemedim konuyu Javascipr bölümüne açmamdaki amaç ise javascript kodu kullanarak yapılabileceği bir şey olarak düşündüğüm içindir.

css'de margin: 0 auto; dersen sağ ve soldan ortalanır. yukarıdanda mesela %30 gibi bir değer verirsin.

margin: 0 auto;
vertical-align: middle;

denemekte fayda var

vertical-align: middle kodu sabit yükseklikteki sayfada çalışır eğer sayfa yüksekliğin sabit değil ise javascript veya jquery ile yapman gerekir.Yatay olara text-align:center ile yapabilirsin fakat yüksekliği javascript veya jquery ile yapman gerekir.

$(function () {

var sayfaYukseklik,sayfaGenislik,resimYukseklik,resimG enislik,netYukseklik,netGenislik;

sayfaYukseklik=$(window).height();
sayfaGenislik=$(window).width();

resimYukseklik=$('.resim').height();
resimGenislik=$('.resim').width();

netYukseklik=(sayfaYukseklik-resimYukseklik)/2;
netGenislik=(sayfaGenislik-resimGenislik)/2;



$('.resim').css({'top':netYukseklik,'left':netGeni slik});


})

Bu sayede sayfana yerleştirdiğin resim sayfayı ortalayacak.