文章/答案/技术大牛

发布

社区首页 >问答首页 >Flickity js帮助，我的Flickity无法工作

问Flickity js帮助，我的Flickity无法工作
EN

Stack Overflow用户

提问于 2021-04-17 00:11:43

回答 1查看 87关注 0票数 0

我的Flickity JS不能工作我能得到一些帮助吗？这是我的HTML和JS。请帮帮我，我已经看了两个youtube视频，虽然我做的完全一样，但似乎不能让它工作。第一部分是我的HTML，第二部分是我的JS。我试着删除我的css，看看它是否影响了它，但没有。

<!DOCTYPE HTML>

<html lang="en">
<head>
<meta charset="UTF-8">
<title>FlowTow</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0"> 
<link rel="stylesheet" href="./css/style.css" type="text/css">
<link rel="stylesheet" href="css/flickity.css">
<link rel="stylesheet" href="https://unpkg.com/flickity@2/dist/flickity.min.css">

<!-- Include Handlebars from a CDN -->
<script src="https://cdn.jsdelivr.net/npm/handlebars@latest/dist/handlebars.js"></script>
<script src="./js/main.js" type=module defer></script>
<script src="https://code.jquery.com/jquery-3.4.1.js"></script>
<script src="js/flickity.js/"> </script>
<script scr="js/flickity1.js"></script>
<script src="https://unpkg.com/flickity@2/dist/flickity.pkgd.min.js"></script>

<div class="main-carousel">
<div class="ten-recent">
<ul id=fan1>
<header class="user">SiddharthToCool</header>
<li><img src=images/fantasy1.jpg alt="fantasy1"></li>
<li class="heart-btn">
<span class="heart"></span>
<span class="numb"></span> 
</li>
<li>New Concept</li>
<li class="DOB">Oct 27th 2000</li>
</ul>
</div>

<div class="ten-recent">
<ul id=fan2>
<header class="user">LonJon</header>
<li><img src=images/fantasy2.jpg alt="fantasy2"></li>
<li class="heart-btn">
<span class="heart"></span>
<span class="numb"></span> 
</li>
<li>Quick sketch xD</li>
<li class="DOB">Oct 27th 2000</li>
</ul>
</div>

<div class="ten-recent">
<ul id=fan3>
<header class="user">DrawnToLife</header>
<li><img src=images/fantasy3.jpg alt="fantasy3"></li>
<li class="heart-btn">
<span class="heart"></span>
<span class="numb"></span> 
</li>
<li>Wish this was my house :c</li>
<li class="DOB">Oct 27th 2000</li>
</ul>
</div>
</div>
</body>
</html>

var elem = document.querySelector('.main-carousel');
var flkty = new Flickity( elem, {
// options
cellAlign: 'left',
contain: true
});

css

javascript

html

jquery

回答 1

Stack Overflow用户

回答已采纳

发布于 2021-04-17 01:02:41

我按照文档操作，它工作得很好。您可能导入了错误的库，我给您留下的代码与您使用cdn codesandbox-example时的代码相同

注意:我发现codesandbox有问题，你必须重新加载2次才能使flickity工作。

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/67128693

复制

相似问题

问Flickity js帮助，我的Flickity无法工作
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问Flickity js帮助，我的Flickity无法工作EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问Flickity js帮助，我的Flickity无法工作
EN