我正在尝试使用 SlickJS 创建幻灯片.
我按照指南创建了这个幻灯片,但是我得到的不是真正的幻灯片,而是一堆 HTML。这是我的作品:
<html>
<head>
<title>My Now Amazing Webpage</title>
<link rel="stylesheet" type="text/css" href="slick/slick.css" />
<link rel="stylesheet" type="text/css" href="slick/slick-theme.css" />
</head>
<body>
<div class="your-class">
<div>1</div>
<div>2</div>
<div>3</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="slick/slick.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('.your-class').slick({
arrows: true,
infinite: true,
slidesToShow: 1,
slidesToScroll: 1
});
});
</script>
</body>
</html>
最佳答案
问题是您正在使用...加载默认样式
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.9.0/slick-theme.min.css" />
如果删除此行,您可以看到按钮和元素适当滑动。然后,您可以更轻松地使用自己的 CSS 为元素设置样式,就像创建自己的自定义按钮一样。
关于javascript - Slick JS 仅在查看 html 时不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/50552208/