1

我正在尝试在我的网站上使用 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 的原因（同样，当我没有显示/隐藏功能时，它也可以正常工作。）

有任何想法吗？

4

2 回答 2

1

我不知道它是什么正确的解决方案，但在我的 div 出现并调用方法后工作正常：

$("#myHiddenDiv").getNiceScroll().onResize();
于 2015-08-08T19:38:51.477 回答
0

首先，将内联 onclick 移动到 docready。如果 nicescroll 附加到 #right 容器，您可以尝试以下操作：

// cache container:
var $right = $('#right');

// use .on() jquery on container:
$right.on('click', '.showLink', function(e){
e.preventDefault()
$right.find('#example').show();

// resize nicescroll
$right.getNiceScroll().show().resize();

}).on('click', '.hideLink',function(e){
e.preventDefault();
$right.find('#example').hide();

// also hide nicescroll:
$right.getNiceScroll.hide();

});
于 2013-07-31T08:26:21.770 回答