我正在尝试让四张照片在轮播上自动播放,但是Slick并未格式化照片或其他任何格式。有人可以告诉我我做错了什么,我可以做些什么来解决?



<!DOCTYPE html>

<head>
<meta charset="UTF-8">

<link rel="stylesheet" type="text/css" href="//cdn.jsdelivr.net/jquery.slick/1.5.9/slick.css"/>

<style>
photo-show {
	width: 40%;
}
</style>


</head>

<body>

<div class="photo-show">
<div><img src="./src/cat1.jpg" alt=""></div>
<div><img src="./src/cat2.jpg" alt=""></div>
<div><img src="./src/cat3.jpg" alt=""></div>
<div><img src="./src/cat4.jpg" alt=""></div>
</div>

<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.2/jquery.min.js"></script>
<script type="text/javascript" src="//cdn.jsdelivr.net/jquery.slick/1.5.9/slick.min.js"></script>

<script type="text/javascript">
    $(document).ready(function(){
      $('.photo-show').slick({
        slidesToShow: 4,
        slidesToScroll: 1,
        autoplay: true,
        autoplaySpeed: 2000,
      });
    });
</script>


</body>

最佳答案

在这里进行猜测,似乎您正在尝试为Slick照片应用样式。您的CSS错误,无法格式化任何图像。

请尝试以下CSS:

<style>
.photo-show img {
    width: 40%;
}
</style>


注意,我添加了一个“。”在photo-show和特定的img之前,以便可以在photo-show容器中样式化图像。

关于javascript - Slick Carousel不格式化,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/36392587/

10-09 22:18