3

我最近开始使用 flexslider。

我正在使用引导程序创建一个网站，并且使用代码嵌入 flexslider 图像变得不可见，我没有结果。

在标题中 

<link rel="stylesheet" type="text/css" href="css/flexslider.css"> 
<script src="js/custom.js"></script>

在custom.js 中 

$(window).load(function() {
    $('.flexslider').flexslider();
});

在体内

<div class="container">
    <div class="row-fluid">
        <div class="flexslider">
            <ul class="slides">
                <li><img src="img/img1.png" /></li>
                <li><img src="img/img2.png" /></li>
            </ul>
        </div>
    </div>
</div>

A 身体的尽头 

<script src="http://code.jquery.com/jquery.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/jquery.flexslider.js"></script>

这是我的代码

谁能解释为什么？

预先感谢

4

1 回答 1

0

一定有一些 jquery 版本问题，你也错过了 bootstrap.css。我制作了完美的 flexslider 小提琴。看看它：http: //jsfiddle.net/7ngoLbxw/1/

$('.flexslider').flexslider();
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
<div class="container">
    <div class="row-fluid">
        <div class="flexslider">
            <ul class="slides">
                <li class="" style="width: 100%; float: left; margin-right: -100%; position: relative; display: block; z-index: 1; opacity: 0;"><img src="http://wallpaperiz.com/wp-content/uploads/2014/10/live-wallpapers-for-desktop-widescreen-7-cool.jpg" draggable="false"></li>
                <li style="width: 100%; float: left; margin-right: -100%; position: relative; display: block; z-index: 2; opacity: 1;" class="flex-active-slide"><img src="http://www.wallpaper.in.net/wp-content/uploads/2014/06/Live-Wallpapers-For-Desktop-Free-Download1.jpg" draggable="false"></li>
            </ul>
        <ol class="flex-control-nav flex-control-paging"><li><a class="">1</a></li><li><a class="flex-active">2</a></li></ol><ul class="flex-direction-nav"><li><a class="flex-prev" href="#">Previous</a></li><li><a class="flex-next" href="#">Next</a></li></ul></div>
    </div>
</div>

于 2014-10-18T09:28:41.250 回答