semantic-ui - 使用语义 UI 的可见性在溢出的 div 中进行无限滚动

Question

我想使用 Semantic UI Visibility Behavior 来使用无限滚动，但在overflow-y: autodiv 内而不是与整个页面相关。这是我的代码的简化版本：

HTML

<div id="myDiv">
  <!-- lots of lines of content -->
  <p class="myElementWithinDiv">Alert should appear when this is visible</p>
</div>

CSS

#myDiv {
  height: 200px;
  overflow-y: auto;
}

jQuery

$('.myElementWithinTheDiv')
    .visibility({
        once: false,
        observeChanges: true,
        onTopVisible: function() {
            console.log('top visible');
        }
});

上面的 JSFiddle 在没有CSS 限制 DIV 高度的情况下工作：https ://jsfiddle.net/jtge3s2o/

上面的 JSFiddle 不适用于限制 DIV高度的 CSS：https ://jsfiddle.net/wznxkef2/2/

有没有办法使这个工作与div集合到一个固定的高度？

标签： semantic-ui

Answer 1

根据行为的设置，上下文可以设置如下：

$('.myElementWithinTheDiv')
    .visibility({
        once: false,
        context: document.getElementById('myDiv'),
        observeChanges: true,
        onTopVisible: function() {
            console.log('top visible');
        }
});