使用jQuery / javascript自动将大于窗口的div居中

Question

我在网站上制作宽度为1920px的div时遇到了一些麻烦。 现在，当页面打开时，我一直在使用以下jQuery代码自动将div居中：

<script type="text/javascript">
$(window).load(function() {
    $('#slider').nivoSlider();

    var extra= 1920 - $(window).width(); 
    var extraleftside= extra/2;
    $("div#scroller").css("left", "-" + extraleftside + "px");
});
</script> 

但是该代码仅在刷新网站时调整，是否可以实时进行？

如果要查看我想要的效果，它与本网站中的滚动背景相同： http : //www.apps.no

LeGEC回答的很好，这段代码成功完成了：

    <script type="text/javascript">
$(window).load(function() {
    $('#slider').nivoSlider();

    var extra= 1920 - $(window).width(); 
    var extraleftside= extra/2;
    $("div#scroller").css("left", "-" + extraleftside + "px");
}


);

$(window).bind("resize", resizeWindow);
function resizeWindow( e ) {
    var extra= 1920 - $(window).width(); 
    var extraleftside= extra/2;
    $("div#scroller").css("left", "-" + extraleftside + "px");
}
</script> 

Answer 1

您是说要根据调整大小重新计算吗？

function doResize(){
    var extra= 1920 - $(window).width(); 
    var extraleftside= extra/2;
    $("div#scroller").css("left", "-" + extraleftside + "px");
}

$(window).load(function(){
    // maybe the slider should also be updated on resize...
    $('#slider').nivoSlider();

    doResize();
});

$(function(){
    $(window).resize(doResize);
});