Question

我觉得很奇怪。我根本无法弄清楚lightSlider。

首先，我在<head>上放了jquery插件。如下所示：

<head>
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.2/jquery-ui.js"></script> 
<link rel="stylesheet" href="assets/js/lightSlider/lightSlider.css" />
<link rel="stylesheet" href="assets/js/lightSlider/jquery.lightSlider.js" />
</head>

其次，我在下面放了这样的HTML：

<div class="produk-details-left">
        <ul id="lightSlider">
            <li>
                <img src="pic1.jpg" />
            </li>
            <li>
                <img src="pic2.jpg" />
            </li>
            <li>
                <img src="pic3.jpg" />
            </li>
            <li>
                <img src="pic4.jpg" />
            </li>
        </ul>
    </div>

最后，我不会忘记放CSS。如下所示：

.produk-details-left ul {
list-style: none outside none;
padding-left: 0;
margin-bottom:0;
}

.produk-details-left li {
display: block;
float: left;
margin-right: 6px;cursor:pointer;
}

.produk-details-left img {
display: block;
height: auto;
max-width: 100%;
}

最后，它正在使用JSFiddle HERE。

总之，它在JSFiddle中工作，但它在我的服务器中不起作用。结果是它看起来不像顶部的图像，底部有缩略图。看起来我的插件不起作用。我真的觉得很奇怪。我错过了什么吗？

已更新

我再次更改了<head>脚本。它仍然不起作用。

<head>
   <script src="//code.jquery.com/jquery-1.10.2.js"></script>
   <script src="//code.jquery.com/ui/1.11.2/jquery-ui.js"></script>
   <link rel="stylesheet" href="assets/js/lightSlider/lightSlider.css" />
   <link rel="stylesheet" href="assets/js/lightSlider/jquery.lightSlider.js" />
   <link rel="stylesheet" href="assets/js/lightSlider/jquery.lightSlider.min.js" />
</head>

Answer 1

您不包含lightSlider

的脚本

<强>尝试：

<head>
   <script src="//code.jquery.com/jquery-1.10.2.js"></script>
   <script src="//code.jquery.com/ui/1.11.2/jquery-ui.js"></script> 
   <link rel="stylesheet" href="assets/js/lightSlider/lightSlider.css" />
   <script src="assets/js/lightSlider/jquery.lightSlider.js" />
</head>

Answer 2

有时使用后会起作用

 $(window).on("load",()=>{
        $("#lightslider").lightSlider({})
}

否则带有 .clone 类的元素将无法正确呈现。

jQuery LightSlider无法正常工作，但在JSFiddle的工作中表现得非常好

2 个答案: