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> 

尽管我已经更改了服务器副本上的 localhost）

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

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

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

非常感谢！

杰克

Answer 1

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

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

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

这可能是一个过程。

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