如何解决Slick.js的滑块未显示
我按照所有步骤操作,如何使用光滑的滑块,但是由于某些原因,图片仅彼此堆叠而不是变成幻灯片 HTML代码:
<!--Slider-->
<link rel="stylesheet" type="text/css" href="//cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick.css"/>
<!--Main-->
<main>
<!--Slider-->
<div class="container-fluid p-0">
<div class="site-slider">
<div class="slider-one">
<div>
<img src="assets/slide1.jpg" class="wid img-fluid" alt="Slika 1">
</div>
<div>
<img src="assets/slide2.jpg" class="wid img-fluid" alt="Slika 1">
</div>
<div>
<img src="assets/slide3.jpg" class="wid img-fluid" alt="Slika 1">
</div>
</div>
</div>
</div>
</main>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script type="text/javascript" src="//cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick.min.js"></script>
<script src="js/main.js"></script>
这是我的JS文件:
$('.slider-one').slick({
autoplay:true,autoplaySpeed:3000,dots:true
});
我一直在尝试解决此问题,但无济于事。因此,任何帮助都会很棒。在此先感谢:D
解决方法
在不指定特定协议的情况下使用双斜杠
使用双斜杠src="\\foo"
加载资源时,您未在定义协议(http,https)。
脚本将使用与加载页面本身相同的协议进行加载。
如果您不使用Web服务器,它将无法使用。
在您的示例中,您可以看到它正在尝试加载file://foo"
(计算机上的文件)。
添加协议https
,以确保成功加载资源。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。