我相信这个问题已被多次询问,我已经研究了很多其他文章,但我担心我陷入了完全的僵局......
我正在尝试制作一个非常基本的flexslider,但它似乎并不想为我工作。图像显示为列表,因此HTML和图像链接似乎正常。这让我相信我错过了JS中的一些东西。
有人能告诉我吗?
提前谢谢了。瑞安
<!DOCTYPE html>
<html>
<head>
<!-- Place somewhere in the <head> of your document -->
<link rel="stylesheet" href="flexslider.css" type="text/css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<script src="jquery.flexslider.js"></script>
<!-- Place in the <head>, after the three links -->
<script type="text/javascript" charset="utf-8">
$(window).load(function() {
$('.flexslider').flexslider();
});
</script>
</head>
<body>
<!-- Place somewhere in the <body> of your page -->
<div class="flexslider">
<ul class="slides">
<li>
<img src="../lachantongeimg/group.jpg" alt=""/>
</li>
<li>
<img src="../lachantongeimg/howtojoin.jpg" alt=""/>
</li>
<li>
<img src="../lachantongeimg/playmusic.jpg" alt=""/>
</li>
</ul>
</div>
</body>
</html>
如果您的照片看起来像列表,则必须是CSS文件。确保文件存在或修复路径。
我在官方文档中找到的唯一区别是动画选项:
$(window).load(function() {
$('.flexslider').flexslider({
animation: "slide"
});
});
这里有一个基本的例子,就像你一样: