【问题标题】:How do I use jquery to dynamically set the height of a div?如何使用 jquery 动态设置 div 的高度?
【发布时间】:2012-10-31 09:55:40
【问题描述】:

这是我的代码,但它不起作用(div 总是浮动到页面顶部。我希望它位于页面中心)。

HTML:

<div id="overlay">Stuff</div>

JQuery:

$(document).ready(function(){
    var height = $('#overlay').height();
    var marginTop = (height)/2;
    document.getElementById("overlay").style.marginTop="-"+marginTop+"px";
    document.getElementById("overlay").style.top="50%";
});

我做错了什么?

【问题讨论】:

    标签: jquery height


    【解决方案1】:
    $(document).ready(function(){
        resize();
        $(window).resize(resize);
    });
    
    function resize()
    {
        var height = $('#overlay').height();
        $('#overlay').css('margin-top', (($(window).height() - height) / 2) + 'px');
    }
    

    请记住,您希望窗口高度减去覆盖高度。然后除以 2,得到所需的边距。

    【讨论】:

    • 谢谢!我注意到,如果我调整窗口大小,那么 div 会保持原样,而不是“重新调整”到新的窗口大小。如何设置您的脚本以在调整窗口大小时进行调整?
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2011-11-04
    • 2011-07-29
    • 1970-01-01
    • 1970-01-01
    • 2013-12-04
    • 2023-01-27
    相关资源
    最近更新 更多