语义UI-如何在模态窗口中使用粘性

Question

我正在使用Smantic-UI，并且我对粘性组件有问题。

我可以在普通页面中使用它，但我无法在模态窗口中工作。

我正在使用：

html：

    <div class="ui modal">
        <div class="header">Title</div>
        <div class="scrolling content">
            <div class="ui sticky">
            ... content I want to have stick ...
        </div>

JS：

    $('.ui.sticky')
        .sticky('refresh')
    ;
    $('.ui.sticky')
        .sticky({
            type: 'fixed',
            offset: 200
        })
    ;

Answer 1

您在元素还可以看到粘性行为之前初始化粘性行为，因为您使用模态，以防止发生这种情况，请使用 onVisible回调来启动粘性行为，如下：

[demo]

JS(jQuery(

$( document ).ready(function() {
    $('.ui.modal').modal('show').modal({
      onVisible:$('.ui.sticky').sticky({
            type: 'fixed',
            offset: 200
        }).sticky('refresh')
    });
});

html

<div class="ui modal">
    <div class="header">Title</div>
    <div class="scrolling content" style="min-height:1000px">
        <div class="ui sticky"> ... content I want to have stick ... </div>
    </div>
</div>