Question

我正在尝试初始化jQuery bxSlider，但出于某种原因，即使添加了网站示例中显示的相同资源，我也无法初始化该插件。

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

我做错了什么？

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

Answer 1

使用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>

Answer 2

您正在<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div id="parent">Parent-(attached event handler)<br><br> <div id="child"> Child<br><br> <p id="grand-child">Grand Child</p> </div> </div> <div id="msg"></div><br> <div id="jQmsg"></div><br> <div id="arrmsg"></div>中创建自己的jQuery版本。这是在您之前已经在DOM中包含jQuery并尝试添加bxSlider插件之后。要解决此问题，请在包含以下内容的行后包含bxSlider javascript ：

/javascripts/application.js

结果如下（记得在进行此更改之前删除原始的bxSlider脚本标记）

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

bxSlider没有初始化

2 个答案: