Flexslider JS 不工作

Question

我相信这个问题已经被问过很多次了，我也研究了许多其他文章，但恐怕我完全陷入了僵局...

我正在尝试制作一个非常基本的 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>

Answer 1

如果您的照片显示为列表，则必须是 CSS 文件。请确保该文件存在或修复您的路径。

我发现与官方文档的唯一区别是动画选项：

$(window).load(function() {
  $('.flexslider').flexslider({
      animation: "slide"
  });
});

这里有一个与您完全一样的基本示例：

https://jsbin.com/jicodadace/2/edit?html,console,output

Flexslider JS 不工作

Flexslider JS Not Working

javascript

jquery

flexslider