滑らかなカルーセル - 中央のスライダーを他よりも大きくしたい

滑らかなプラグインはカルーセルのために最適です&お客様の声私は滑らかなカルーセルプラグインのセンターモード属性を使用しようとしています。彼らのウェブサイトでは、センターモード（centerMode：true）はアクティブなスライドが残りの部分より大きくなることを示します。しかし、それは起こっていない！これは、滑らかなサイトのURLです：http://kenwheeler.github.io/slick/滑らかなカルーセル - 中央のスライダーを他よりも大きくしたい

は、これは私のコードです：

<html> 
    <head> 
    <meta charset="utf-8"> 
    <title>Youg Desai</title> 
    <link rel="stylesheet" href="js/slick/slick.css"> 
     <link rel="stylesheet" href="js/slick/slick-theme.css"> 
    </head> 
    <style> 

    .slick-center .slide-h3{ 
    color: #FFF; 
    } 
    .slider{ 
    width: 600px; 
    height:150px; 
    margin: 20px auto;  
    text-align: center; 
    } 
    .slide-h3{ 
    margin: 10% 0 10% 0; 
    padding: 40% 20%; 
    background: #008ed6; 
    } 
    .slider div{ 
    margin-right: 5px; 
    } 
    .slick-slide{ 
    opacity: .6; 
    } 
    .slick-center{ 
    display: block; 
    max-width: 10% !important; 
    max-height:20% !important; 
    opacity: 1; 


    } 
    </style> 
    <body> 
    <section id="slick-content"> 

    <div class="slider"> 
    <div><div class="slide-h3">1</div></div> 
    <div><div class="slide-h3">2</div></div> 
    <div><div class="slide-h3">3</div></div> 
    <div><div class="slide-h3">4</div></div> 
    <div><div class="slide-h3">5</div></div> 
    <div><div class="slide-h3">6</div></div> 

    </div> 
</body> 
<script src="js/jquery-1.11.2.min.js"></script> 
<script src="js/slick/slick.js"></script> 





    <script type="text/javascript"> 
    $(document).ready(function(){ 
    $('.slider').slick({ 
    centerMode: true, 
    centerPadding: '60px', 
    slidesToShow: 3, 
    speed:1500, 
    index: 2, 
    responsive: [ 
    { 
     breakpoint: 768, 
     settings: { 
     arrows: false, 
     centerMode: true, 
     centerPadding: '40px', 
     slidesToShow: 3 
     } 
    }, 
    { 
     breakpoint: 480, 
     settings: { 
     arrows: false, 
     centerMode: true, 
     centerPadding: '40px', 
     slidesToShow: 1 
     } 
    } 
    ] 
}); 
    }); 
    </script> 

    </body> 
</html>

出典

2017-02-02 Ashique Desai

'http：// kenwheeler.github.io/slick /'の後ろのリンクは、あなたの質問に関連しているかわからない画像です。いずれにせよ、あなたの質問を[編集]（http://stackoverflow.com/posts/42000555/edit）して、リンク先を正しいリンクアドレスに更新してください – caramba

は最後にスタックオーバーフロー自体に答えを見つけました！この質問を見ている人が検索する必要がないように、ここに投稿してください。

.slick-center { 
    -webkit-transform: scale(1.25); 
    -moz-transform: scale(1.25); 
    transform: scale(1.25); 
}

上記はセンタースライダを大きくします。あなたはパディングを調整する必要があるかもしれません。

出典

2017-02-02 11:25:55

滑らかなカルーセル - 中央のスライダーを他よりも大きくしたい

答えて

関連する問題