Question

我正在尝试将四张照片自动播放到旋转木马上，但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>

Answer 1

在这里猜测，看起来您正在尝试将样式应用于光滑的照片。您的CSS错误，不会格式化您的任何图片。

请尝试使用此CSS：

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

请注意我添加了一个“。”在photo-show和特定img之前，您可以在photo-show容器中对图像进行样式化。

光滑的轮播不格式化

1 个答案: