bxSlider不初始化

我試圖初始化jQuery bxSlider，但由於某些原因，即使添加相同的資源，如網站上顯示的示例我不能初始化該插件。bxSlider不初始化

$(document).ready(function() { 
    $('.bxslider').bxSlider({ 
     mode: 'fade', 
     captions: true 
    }); 
});

我在做什麼錯？

的jsfiddle：https://jsfiddle.net/rcymj0s0/2/

來源

2016-04-28 user3615851

您需要正確包含腳本：https：//jsfiddle.net/rcymj0s0/5/。請參閱我使用的CDN位置左側的「外部資源」選項卡。請注意，這兩張幻燈片中的圖像相同，因此沒有任何內容會在此處發生變化。您可以從底部的傳呼機圖標看到它的作用。 –

在您的jsfiddle控制檯中有jQuery錯誤（ReferenceError：$未定義），請檢查它。 –

JSFiddle演示了我的網站html結構，並且它不適用於此設置。控制檯日誌'bxSlider不是函數' – user3615851

使用this cdn路徑，它將工作。

$('.bxslider').bxSlider({ 
 
    captions: true 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/bxslider/4.2.5/vendor/jquery.easing.1.3.js"></script> 
 

 
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/bxslider/4.2.5/jquery.bxslider.min.js"></script> 
 

 
<link rel="stylesheet" type="text/css" href="//cdnjs.cloudflare.com/ajax/libs/bxslider/4.2.5/jquery.bxslider.min.css"> 
 
    
 
<div id="slider-section"> 
 
    <ul class="bxslider"> 
 
    <li><img src="http://media.voog.com/0000/0039/0203/photos/icon.png" /></li> 
 
    <li><img src="http://media.voog.com/0000/0039/0203/photos/icon.png" /></li> 
 
    </ul> 
 
</div>

來源

2016-04-28 13:15:44

你在/javascripts/application.js創建自己的jQuery的版本。這是之前您已經在DOM中包含jQuery並嘗試添加bxSlider插件之後。要解決此問題，包括bxSlider具有以下行後的JavaScript ：

<script src="/javascripts/application.js"></script>

結果將是如下（記住做此更改之前刪除原始bxSlider腳本標籤）

<script src="/javascripts/application.js"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/bxslider/4.2.5/jquery.bxslider.js"></script>

來源

2016-04-28 13:20:29

bxSlider不初始化

回答

相關問題