2017-06-26 10 views
1

私はhttps://github.com/kenwheeler/slickを私のウェブサイトのカルーセルとして使用しています。私はTにチュートリアルに従って、すべてが(私の知る限り)どのようになることを意味しています。ここでは、コード滑らかなカルーセルが表示されていない/作業中

$(document).ready(function(){ 
 
    $('.slider').slick({ 
 
    slidesToShow: 1, 
 
    slidesToScroll: 1, 
 
    arrows: false, 
 
    fade: true, 
 
    asNavFor: '.slider-nav' 
 
    }); 
 
    $(".slider-nav").slick({ 
 
    slidesToShow: 3, 
 
    slidesToScroll, 1, 
 
    asNavFor: '.slider', 
 
    dots: true, 
 
    focusOnSelect, true 
 
    }); 
 
    });
<!DOCTYPE html> 
 
<html> 
 
<head> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> 
 
    <!--Semantic import--> 
 
    <script src="assets/semantic/semantic.min.js"></script> 
 
    <link href="assets/semantic/semantic.min.css" rel="stylesheet" /> 
 

 
    <!-- Slick --> 
 
    <link rel="stylesheet" type="text/css" href="http://cdn.jsdelivr.net/jquery.slick/1.6.0/slick.css"/> 
 
    <link rel="stylesheet" type="text/css" href="http://cdn.jsdelivr.net/jquery.slick/1.6.0/slick-theme.css"/> 
 
    <script type="text/javascript" src="http://cdn.jsdelivr.net/jquery.slick/1.6.0/slick.min.js"></script> 
 
    <!--Font--> 
 
    <link href="https://fonts.googleapis.com/css?family=Exo+2|Ubuntu" rel="stylesheet"> 
 
    <!-- Javascript --> 
 
    <script src="js/root.js"></script> 
 
    <script src="js/gamesdev.js"></script> 
 

 
</head> 
 
<body> 
 
    <div class="pusher"> 
 
    <div id="page"> 
 
     <div class="ui container"> 
 
     <div class="slider"> 
 
      <div><h3>1</h3></div> 
 
      <div><h3>2</h3></div> 
 
      <div>3</div> 
 
      <div>4</div> 
 
      <div>5</div> 
 
      <div>6</div> 
 
     </div> 
 
     <div class="slider-nav"> 
 
      <div>1</div> 
 
      <div>2</div> 
 
      <div>3</div> 
 
      <div>4</div> 
 
      <div>5</div> 
 
      <div>6</div> 
 
     </div> 
 
     </div> 
 
    </div> 
 
    </div> 
 
</body> 
 
</html>

私は、すべての不要なコードを切り取ってきたが、ここで結果は

http://i.imgur.com/3M26NFd.png

である私が間違って何が起こっているのか全く気手掛かりを持っていない、私は」です1時間、おそらく2時間のようにそれを通って梳かれました。

+0

'ERRORにfocusOnSelect, trueを変更:{ "メッセージ": "キャッチされないでSyntaxError:予期しないトークン、"、 "ファイル名" "https://stacksnippets.net/js"、 "LINENO":66、 "COLNO":22 } ' 変更slidesToScroll' 'にslidesToScroll、1 ':1' – InvincibleM

+0

無駄も、もし2番目のケースだったカルーセルが機能します。 –

答えて

1

構文エラーのため、おそらく動作しません。あなたはslidesToScroll: 1,

にコロン

変更slidesToScroll, 1,の代わりにカンマを持っており、focusOnSelect: true

+0

まだそれを修正していません。 –

+0

@LamarTonyDaughma focusOnSelectの後にコロンの代わりに別のカンマがあります。それはそれを修正する必要があります – yoshiMannaert

+0

がそれを持っています。ありがとう。私は盲目なので、私は盲目だからxH –

関連する問題