如何使用jQuery脚本解决相同的错误，使DIV以百分比为中心？

这是我的密码

<style>

.className{
width:55%;
height:auto;
margin:0 auto;
}

body{
text-align:center;
}

</style>

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script>

$(document).ready(function(){

$(window).resize(function(){

$('.className').css({
position:'absolute',
left: ($(window).width() - $('.className').outerWidth())/2,
top: ($(window).height() - $('.className').outerHeight())/2
});

});
// To initially run the function:
$(window).resize();

});

</script>

.类名{
宽度：55%；
高度：自动；
保证金：0自动；
}
身体{
文本对齐：居中；
}
$（文档）.ready（函数（）{
$（窗口）。调整大小（函数（）{
$（'.className'）.css({
位置：'绝对'，
左：（$（window.width（）-$（'.className'）.outerWidth（））/2，
顶部：（$（窗口）.height（）-$（'.className'）.outerHeight（））/2
});
});
//要最初运行该函数，请执行以下操作：
$（窗口）.resize（）；
});

当我打开我的页面时，我看到我的DIV没有居中，但当我缩小并完全打开浏览器窗口时，DIV完全居中，请帮我一下，我快疯了 我试着改变

这个

$（文档）.ready（函数（）{
$（窗口）。调整大小（函数（）{
$（'.className'）.css({
位置：'绝对'，
左：（$（window.width（）-$（'.className'）.outerWidth（））/2，
顶部：（$（窗口）.height（）-$（'.className'）.outerHeight（））/2
});
});
//要最初运行该函数，请执行以下操作：
$（窗口）.resize（）；
});

用这个（TXH给Elhussein Hashem）

$（文档）.ready（函数（）{
resizeFunction（）；
window.onresize=函数（）{
resizeFunction（）；
};
resizeFunction（）；
});
函数resizeFunction（）{
$（'.className'）.css({
位置：'绝对'，
左：（$（document）.width（）-$（'.className'）.outerWidth（））/2，
顶部：（$（document.height（）-$（'.className'）.outerHeight（））/2
});
}

但结果并没有改变：(

我注意到，即使在刷新页面时，也会像缩小并重新打开浏览器窗口时一样，使页面重新居中

这是分区

<div class="className">
<div><img style="width:100%" src="http://i39.tinypic.com/5f506d.jpg"/></div>
</div>

plz HE L P

---

M E

如果我们可以看到该页面，那就更容易了，但是您可以尝试使用window.load。我猜，由于您的类有一个图像，在.className有一个宽度（它知道它有一个图像，但不知道图像的大小）之前调用ready

//window.load在运行之前等待图形完成加载
$（窗口）。加载（函数（）{
$（窗口）。调整大小（函数（）{
$（'.className'）.css({
位置：'绝对'，
左：（$（window.width（）-$（'.className'）.outerWidth（））/2，
顶部：（$（窗口）.height（）-$（'.className'）.outerHeight（））/2
});
});
//要最初运行该函数，请执行以下操作：
$（窗口）.resize（）；
});

我也猜可能是重复的+1@daveTHX 1000，工作，但还有一个小问题，现在当我打开网站的第二个1-2我看到的DIV窃听像旧代码，但在1秒2秒的DIV是自我中心在页面的中间，为什么？

<script>
$(document).ready(function(){

     resizeFunction();

    window.onresize = function() {
        resizeFunction();
    };

     resizeFunction();

});

function resizeFunction(){
    $('.className').css({
        position:'absolute',
        left: ($(document).width() - $('.className').outerWidth())/2,
        top: ($(document).height() - $('.className').outerHeight())/2
    });
}
</script>

<div class="className">
<div><img style="width:100%" src="http://i39.tinypic.com/5f506d.jpg"/></div>
</div>

<script>
//window.load waits for graphics to finish loading before running
$(window).load(function(){
  $(window).resize(function(){
    $('.className').css({
      position:'absolute',
      left: ($(window).width() - $('.className').outerWidth())/2,
      top: ($(window).height() - $('.className').outerHeight())/2
    });
  });
  // To initially run the function:
  $(window).resize();
});
</script>