jQuery jScrollPane - 它根本不起作用! :'(

Question

好吧 - 我承认，我是这个 jQuery 部门的初学者。我可能犯了一些业余错误，但是嘿，你必须在某个地方学习! :)

所以我正在使用 jScrollPane:http://www.kelvinluck.com/assets/jquery/jScrollPane/jScrollPane.html

我想使用它来设置第二列中的可滚动区域的样式。具体来说，我想在 div #ajaxresults

上应用和格式化滚动条

我的页面...相当 jQuery 重。我不知道是否有任何变量发生冲突或其他什么......事实上我真的不知道为什么这不起作用。

看看我有问题的页面: http://furnace.howcode.com

在标题中，我已将其设置为:

    <!-- Includes for jScrollPane --> 
<script type="text/javascript" src="http://localhost:8888/js/jquery.mousewheel.min.js"></script> 
<script type="text/javascript" src="http://localhost:8888/js/jScrollPane.js"></script> 
<link rel="stylesheet" type="text/css" media="all" href="http://localhost:8888/stylesheets/jScrollPane.css" /> 
<script type="text/javascript"> 
$(function() {
    $('#ajaxresults').jScrollPane();
});
</script> 

(不过我已经更改了服务器副本上的本地主机)

#ajaxresults div 似乎不起作用。正如 jScrollPane 文档所说，我已经设置了 overflow:auto 但仍然没有运气。我发现当 jScrollPane 似乎“运行”时，它只是将 div 向下移动大约 100 像素。亲自尝试一下。

也许有人可以帮忙？那里有很多 jQuery 插件，所以我不知道是否有东西发生碰撞/崩溃等...

请注意，该网站仍在我和 friend 之间开发中，这解释了我们互相提交的个人消息(“嗨唐尼!”等:D)。此外，当您查看页面时，第二列中可能有几秒钟不会出现任何内容 - 它只是通过 Ajax 获取数据。所以给它一点时间。

非常感谢!

jack

Answer 1

查看您的代码后，让我印象深刻的第一件事是您将 JS 代码放置在“ajaxresults”div 中。一般来说，最好将代码保留在目标 div 之外。像这样放置空 div:

<div id="ajaxresults" class="scroll-pane"></div>

在底部并使用 jQuery 填充类似 .append() 的内容或.html() 。有很多选择。我确信我可以编织更多东西，但这似乎是我建议的第一个重大改变。

这可能是一个过程。

此外，如果您还没有Firebug ，我可能建议获取一份副本。它对 jQuery 调试确实很有帮助。