jScrollPane滚动条问题 [英] jScrollPane Scrollbar Problem

问题描述

我正在使用Wordpress作为CMS的网站上工作，我想在我网站上的div中使用自定义滚动条。我一直在尝试使用jScrollPane插件，但我无法让它工作。

I am working on a site using Wordpress as a CMS, and I wanted to use a custom scroll bar inside a div on my website. I've been trying to use the jScrollPane plugin, but I'm having trouble getting it to work.

主要代码在我的header.php文件中，那里是一个.scroll-pane类，header.php中的相关代码是：

the main code is in my header.php file, and there is a class .scroll-pane the relevant code in header.php is:

 <style type="text/css" id="page-css"> 
            .scroll-pane
                {
                    width: 100%;
                    height: 280px;
                    overflow: auto;
                }
        </style>
    <script src="<?php bloginfo('template_url'); ?>/js/jquery-1.3.2.min.js"></script>
    <link type="text/css" href="<?php bloginfo(template_url); ?>/style/jquery.jscrollpane.css" rel="stylesheet" media="all" />
    <script type="text/javascript" src="<?php bloginfo(template_url); ?>/js/jquery.mousewheel.js"></script>
    <script type="text/javascript" src="<?php bloginfo(template_url); ?>/js/jquery.jscrollpane.min.js"></script>

        <script type="text/javascript"> 
            var $j = jQuery.noConflict();
            $j(document).ready(function()
            {   
                $('.scroll-pane').jScrollPane({showArrows: true});
            });
        </script> 

page.php：

< div id="sign-right">

< div class="newsBox-padding">

< div class="scroll-pane newsBox"> WP loop goes here </div></div>


CSS:
.newsBox{height:280px; overflow: auto;}

我收到以下错误（被firebug捕获）：

I get the following error (caught with firebug):

" $(".scroll-pane").jScrollPane is not a function
$('.scroll-pane').jScrollPane({showArrows: true}); "

我认为问题在于函数所以我是尝试了各种帖子和论坛的一些建议，包括：

I think the problem is in the function so I've tried a bunch of suggestions from various posts and forums including:

$function(){ jQuery('.scroll-pane').jScrollPane({showArrows: true});

$function(){ $('.scroll-pane').jScrollPane({showArrows: true}); });

我已经检查了所有对外部文件的引用，并确保类的名称相同，它们是一切似乎都是正确的。而且我有一个熟悉代码的朋友也看看它，但无济于事。

I've checked all of my references to external files and made sure classes were named the same, they all seem to be right. And I've had a code savvy friend look at it too, to no avail.

我真的很感谢你的帮助！

I really appreciate your help!

推荐答案

也许我在这里遗漏了一些东西，从未使用过jscrollpane，但我没有看到你包括jquery本身。你也叫noconflict然后在你的函数中使用$。

Maybe I'm missing something here, never used jscrollpane, but I don't see you including jquery itself. Also you call noconflict and then still use $ in your function.

这篇关于jScrollPane滚动条问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！