javascript - 显示隐藏的 div 时，nicescroll 不滚动

Question

我正在尝试在我的网站上使用 NiceScroll，它在任何地方都可以工作，除了我有一个隐藏的 div 的一个页面。基本上，我有一个链接，单击该链接会显示之前隐藏在页面上的一些内容。问题 - 单击链接并显示内容后，它会溢出并且不可见且不可滚动。 Nicescroll 由于某种原因无法工作。

两者都在页面上独立工作 - 意思是 - 如果我取出 NiceScroll 代码并保留显示/隐藏 div 代码，那么我可以单击链接，页面将变得更长，并且会出现常规滚动条，并且我可以向下滚动到内容的底部。相反，如果我取出显示/隐藏代码(仅使内容在页面加载时显示)并保留在 NiceScroll 代码中，则页面将作为长页面加载，并且 NiceScroll 栏将显示并正常工作。

我就是无法让他们一起工作。我认为这与页面首次加载时不需要可滚动以及最初调用 Nicescroll 时有关，因此它只是说“我不需要为该页面工作”，然后放弃。所以，我尝试复制在我看来像“nicescroll启动代码”的内容

<script>
  $(document).ready(function() {    
    $("#right").niceScroll();
  });
</script>

进入单击显示/隐藏链接时调用的函数，希望能够“重新启动”它，但这也不起作用。

显示/隐藏功能如下所示:

function showHide(shID) {
    if (document.getElementById(shID)) {
        if (document.getElementById(shID+'-show').style.display != 'none') {
            document.getElementById(shID+'-show').style.display = 'none';
            document.getElementById(shID).style.display = 'block';
        }
        else {
            document.getElementById(shID+'-show').style.display = 'inline';
            document.getElementById(shID).style.display = 'none';
        }
    }
}

页面的实际 div 部分如下所示:

 <a href="#" id="example-show" class="showLink" onclick="showHide('example');return false;">-Show Stuff</a>
                <div id="example" class="more">
                    <p>
                    "Stuff here"
                    </p>
                    <p><a href="#" id="example-hide" class="hideLink" 
                    onclick="showHide('example');return false;">-Hide Stuff-</a></p>
                </div>

所有内容都包含在 id="right"的 div 中，这就是 Nicescroll 脚本将其应用于 #right 的原因(当我没有显示/隐藏功能时，它可以正常工作。)

有什么想法吗？

Answer 1

我不知道正确的解决方案是什么，但在我的 div 显示并调用方法后工作正常:

$("#myHiddenDiv").getNiceScroll().onResize();