jquery - Bootstrap：affix.js - 当我用 js 调用它时，我无法获取另一个元素的高度并将其放入对象中

Question

这是我的html代码：

<div class="masthead">
    <img class="img-responsive" data-src="holder.js/990x150/auto" alt="Generic placeholder image">
</div>
<!-- /container -->
<div id="menu-gora" class="navbar navbar-inverse  affix-top">

Img 是响应式元素，在我的笔记本电脑上它有 150 像素。当我尝试：

$(document).ready(function(){
        $('#menu-gora').affix({
          offset: {
            top: 150
          }
        });
    });

它工作正常。但它不适用于：

top: $('.masthead img').height()

它在通过 30 像素后开始“粘贴”。每时每刻。我需要它来响应，我不知道我做错了什么：/

当我用 读取值时console.log($('.masthead img').height())，它显示了正确的值。问题是什么？

Answer 1

根据引导文档，具有动态高度的“正确”方法是在函数中返回值，例如

$('#menu-gora').affix({
    offset: {
        top: function () {
            return (this.top = $('.masthead img').height());
       }
    }
});

然而！这不考虑动态大小的内容，因此例如，如果您有一个旋转木马或手风琴的东西会改变附加元素的高度，您将不得不重新计算新的高度。据我所知，没有办法动态更改偏移量。现在我正在做的只是在大小发生变化时重新应用词缀（我的附加菜单上方有未知数量的折叠）。