jScrollPane滾動條問題

Question

我正在使用Wordpress作爲CMS的網站上工作，我想在我的網站上使用自定義滾動條。我一直在嘗試使用jScrollPane插件，但我無法使其工作。

主要代碼是在我的header.php文件，並且還有一類.scroll窗格中的header.php的相關代碼：

<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;} 

我得到以下錯誤（補時螢火蟲）：

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

我認爲這個問題是在功能，所以我已經嘗試了一堆sugge的從各個崗位和論壇stions包括：

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

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

我已經檢查了所有我引用到外部文件並確保類被命名一樣，他們都似乎是正確的。而且我有一位精通代碼的朋友也看了一下，無濟於事。

我真的很感謝你的幫忙！

Answer 1

也許我在這裏錯過了一些東西，從來沒有使用jscrollpane，但我沒有看到你包括jquery本身。你也可以調用noconflict，然後在你的函數中使用$。

Answer 2

我沒看到你包含最新的jQuery，請嘗試添加它。 要使用谷歌主機添加了最新的jQuery：

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript" /> 

並嘗試使用Chrome的開發者工具，然後資源選項卡，然後你會看到它的JS文件的網絡實際負荷。

你可以看到我的那些滾動條博客好貼：jQuery Scrollbars

也像@kingjiv說，你使用的衝突則「$」。 嘗試去掉他的衝突，並且只使用：

<script type="text/javascript"> $(function() { 
    $('.scroll-pane').jScrollPane(); 
}); 
<script> 

如果仍然無法正常工作，JScrollPane的prolly加載jQuery不會了。 要解決這個問題嘗試這些方法：

第一運動找你

<script type="text/javascript"> $(function() { 
    $('.scroll-pane').jScrollPane(); 
}); 
<script> 

到底的</body>結束標記之後。

如果仍然無法正常工作嘗試使用當文檔準備

<script type="text/javascript"> 
    $(document).ready(function() { 
     $('.scroll-pane').jScrollPane(); 
    }); 
<script> 

必須工作:)

最新問題

• 1.
• 2.
• 3.
• 4.
• 5.
• 6.
• 7.
• 8.
• 9.
• 10.

 相關問題

• 1.
• 2.
• 3.
• 4.
• 5.
• 6.
• 7.
• 8.
• 9.
• 10.