1

初めて滑らかなスライダーを実装しようとしていますが、機能していません。コンソールにエラーは表示されません。提供されるデモでは、各スライドの div に開始時に次の属性が与えられます。

<div class="slick-slide"  style="width: 560px; position: relative; left: 0px; top: 0px; z-index: 900; opacity: 1;">

しかし、私のスライダーでは、これらの属性が指定されておらず、何も起こりません。以下は私のコードです：

  <head>
    <link rel="stylesheet" type="text/css" href="slick/slick.css"/>
</head>

<div class="slider fade">
                    <div><div class="image"><img src="img/fonz1.png"/></div></div>
                    <div><div class="image"><img src="img/fonz2.png"/></div></div>
                    <div><div class="image"><img src="img/fonz3.png"/></div></div>
                </div>



<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<script type="text/javascript" src="http://code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/highlight.js/8.0/highlight.min.js"></script>
<script src="bower_components/foundation/js/foundation.min.js"></script>
<script src="js/app.js"></script>
<script type="text/javascript" src="slick/slick.js"></script>

            <script type="text/javascript">
            $(document).ready(function(){
                $('.fade').slick({
                       dots: true,
                      infinite: true,
                      speed: 500,
                      fade: true,
                      slide: '> div',
                      cssEase: 'linear'
                });
            });
        </script>
4

2 に答える 2

2

余分なものを削除しますdiv：

変化する：

<div><div class="image"><img src="img/fonz1.png"/></div></div>

に：

<div class="image"><img src="img/fonz1.png"/></div>

class="image"オプションです

于 2014-10-19T19:13:36.720 に答える