Foundation Sticky无法在隐藏的div上正确初始化

Question

背景：我有两个带有粘性标头的表（使用li标签制成）。一个开始隐藏，另一个立即显示。这是我对它们两个都使用的粘性实现（显然具有不同的ID）

<div id="listContainer">
    <div class="row" data-sticky-container>
        <div id="stickyMenu" class="columns small-12 show-for-medium" data-sticky data-sticky-on="small" data-margin-top="0" data-anchor="listContainer">
            <div class="row">
                <div class="columns small-12">
                    <div style="background-color: #96d1f2; padding: .5rem 1rem">
                        <div class="row text-center">
                            <!-- Header Stuff -->
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="row">
        <div class="columns small-12">
            <div style="border: 1px solid #96d1f2;">
                <ul class="no-bullet" id="partList" style="margin: 0;">
                    <!-- List/Table Items -->
                </ul>
            </div>
        </div>
    </div>
<div>

一个被隐藏的对象被简单地隐藏，就像jQuery在style属性中使用display: none;一样。

无论我选择开始隐藏哪一个，另一个总是以一个一直向左挤压的标头结尾，而且没有粘性。

当用户从下拉列表中选择某些内容时，为了简化起见，使用jQuery显示/隐藏了表格。我们可能最终会使用单选按钮或其他功能，但这只是开发中的方式，而不是问题的一部分。

问题：为什么会发生这种情况，我该如何解决或解决呢？

我已经尝试过的事情：初始化粘性部分后，我已经尝试隐藏它。在这种情况下，我尝试在加载页面的自定义javascript之后将其隐藏，而不是从一开始就将其设置为隐藏。仍然没有用。