如何解决我需要在我的网站JS中使用Slick Carousel作为Hero Slider
我仍在学习javascript，现在我正在尝试使Slick Carousel工作。我需要它作为网页上的英雄滑块
github上的光滑轮播： https://github.com/kenwheeler/slick/
这是我到目前为止所拥有的：
<html>
<head>
<title>Hero Slider</title>
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.8.1/slick.css"/>
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.8.1/slick-theme.css"/>
</head>
<body>
<div class="single-item">
<div><img src="https://images.unsplash.com/photo-1604467758117-72d987cb513b?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=334&q=80" alt="test"></div>
<div><img src="https://images.unsplash.com/photo-1604475935971-c390654d2332?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=321&q=80" alt="test"></div>
<div><img src="https://images.unsplash.com/photo-1604470690311-c4136298584d?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=714&q=80" alt="test"></div>
</div>
<script type="text/javascript" src="//code.jquery.com/jquery-1.11.0.min.js"></script>
<script type="text/javascript" src="//code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.8.1/slick.min.js"></script>
<script type="text/javascript">
$('.single-item').slick();
});
</script>
</body>
</html>您能指导我进行此操作缺少什么吗？如前所述，我需要将其用作英雄滑块，并且此后我还将在该网页上添加标题。所以这也应该适用。
解决方法
只有一个小错字。
<html>
<head>
<title>Hero Slider</title>
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.8.1/slick.css"/>
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.8.1/slick-theme.css"/>
</head>
<body>
<div class="single-item">
<div><img src="https://images.unsplash.com/photo-1604467758117-72d987cb513b?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=334&q=80" alt="test"></div>
<div><img src="https://images.unsplash.com/photo-1604475935971-c390654d2332?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=321&q=80" alt="test"></div>
<div><img src="https://images.unsplash.com/photo-1604470690311-c4136298584d?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=714&q=80" alt="test"></div>
</div>
<script type="text/javascript" src="//code.jquery.com/jquery-1.11.0.min.js"></script>
<script type="text/javascript" src="//code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.8.1/slick.min.js"></script>
<script type="text/javascript">
$('.single-item').slick();
//Removed a }); here
</script>
</body>
</html>
版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 dio@foxmail.com 举报，一经查实，本站将立刻删除。
