Flexslider JS无法正常工作

问题描述 投票:0回答:1

我相信这个问题已被多次询问,我已经研究了很多其他文章,但我担心我陷入了完全的僵局......

我正在尝试制作一个非常基本的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>
javascript jquery flexslider
1个回答
0
投票

如果您的照片看起来像列表,则必须是CSS文件。确保文件存在或修复路径。

我在官方文档中找到的唯一区别是动画选项:

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

这里有一个基本的例子,就像你一样:

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

© www.soinside.com 2019 - 2024. All rights reserved.