Question

您好专家

这是我的HTML：

<div class="full-height">
    <h1>Lorem</h1>
</div>

我使用jQuery设置div.full-height的高度如下：

$(document).ready(function() {
    function setHeight() {
        viewportHeight = $(window).height();
        $('.full-height').height(viewportHeight);
    };
    setHeight();

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

现在，我尝试使用jQuery UI将h1中div.full-height的位置设置为center center，如下所示：

$('.full-height > h1').position({
    my: 'center center',
    at: 'center center',
    of: '.full-height'
});

问题是，如果我在CSS中设置了固定的height属性，它只能正确定位。

其他div.full-height有完整的高度，但其中的h2位于顶部，因为jQuery UI的.position()函数不知道div.full-height有100％的身高。

我怎样才能让它发挥作用？

问候

拉尔夫

Answer 1

嗨专家

那很快。： - ）

我刚刚通过调整jQuery UI函数来解决问题，如果调整大小的funktion如下：

$(document).ready(function() {
    function setHeight() {
        viewportHeight = $(window).height();
        $('.full-height').height(viewportHeight);
        $('.full-height > h1').position({
            my: 'center center',
            at: 'center center',
            of: '.full-height'
        });
    };
    setHeight();

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

谢谢！

问候

拉尔夫

jQuery UI .position（）用jQuery错过了目标元素集的高度.height（）

1 个答案: