jQuery 根据另一个 div 的位置为一个 div 设置 css 值

Question

我的页面上有一个名为“.nav-wrapper”的 div - 这个 div 的位置将位于多个位置之一，具体取决于后端的用户设置。我想做的是使用 jQuery，确定此 div 的顶部位置，如果它是某个值，则将 margin-top 值添加到不同的 div。

例如，下面我试图说明如果 .nav-wrapper 顶部位置为 0，则将 .header-wrapper-other 的最小高度更改为 50px。这是我的代码，但目前它什么都不做:

var MenuPosition = $('.nav_wrapper').css('top').val();
if (MenuPosition == 0) {
    $('.header-wrapper-other').css('min-height','50px');
};

这是示例中两个 div 的 css:

.header-wrapper-other {
background-attachment: fixed;
background-size: cover;
min-height: 200px;
}

.nav-wrapper {
padding: 10px 20px;
position: absolute;
top: 0px;
width: 100%;
z-index: 1000;
}

Answer 1

应该是 .css('top') 而不是 .css('top').val()

但是这将返回一个类似于 XXpx 的字符串，这可能不是您想要的。

您应该使用以下方法返回一个可用的数字进行比较

var MenuPosition = $('.nav_wrapper').position();
if (MenuPosition.top == 0) {
    $('.header-wrapper-other').css('min-height','50px');
};

DEMO