时间戳

首页 > 解决方案 > 光滑的滑块在引导程序 4 中无法正常工作

javascript - 光滑的滑块在引导程序 4 中无法正常工作

问题描述

我认为我根据 slick slider 官方网站所做的一切都是正确的，但是一旦我完成了所有设置，滑块就不起作用，它只会显示一个在另一个之上的图像。

这是我的代码：

头部元素

<link rel="stylesheet" type="text/css" href="slick/slick.css"/>
<link rel="stylesheet" type="text/css" href="slick/slick-theme.css"/>

身体元素

<div class="col-sm-12">
    <div class="autoplay">
        <div><img src=".\slickpics\cookie1.png"></div>
        <div><img src=".\slickpics\cookie1.png"></div>
        <div><img src=".\slickpics\cookie1.png"></div>
        <div><img src=".\slickpics\cookie1.png"></div>
        <div><img src=".\slickpics\cookie1.png"></div>
        <div><img src=".\slickpics\cookie1.png"></div>
        <div><img src=".\slickpics\cookie1.png"></div>
        <div><img src=".\slickpics\cookie1.png"></div>
        <div><img src=".\slickpics\cookie1.png"></div>
    </div>
</div>

在主体关闭元素之前

<script src="https://code.jquery.com/jquery-1.12.4.min.js" integrity="sha256-ZosEbRLbNQzLpnKIkEdrPv7lOy9C27hHQ+Xp8a4MxAQ=" crossorigin="anonymous"></script>
<script src="https://code.jquery.com/jquery-migrate-3.1.0.min.js" integrity="sha256-ycJeXbll9m7dHKeaPbXBkZH8BuP99SmPm/8q5O+SbBc=" crossorigin="anonymous"></script>
<script type="text/javascript" src="/slick/slick.min.js"></script>

最后的javascript

$(document).ready(function(){
    $('.autoplay').slick({
      slidesToShow: 3,
      slidesToScroll: 1,
      infinite: true,
      autoplay: true,
      autoplaySpeed: 2000,
    });
});

任何形式的帮助将不胜感激，并感谢您的宝贵时间。

标签： javascriptbootstrap-4slider

解决方案

重复了 jQuery CND，有一个用于引导程序，一个用于 slickslider，我通过删除其中一个解决了这个问题，特别是来自 slickslider 的那个。

推荐阅读