jquery.flipster不顯示隱藏和顯示旋轉木馬2

Question

當我試圖將2個轉盤到我的web應用程序中使用jquery.flipster：https://github.com/drien/jquery-flipster

但是我只有每一個試圖一次顯示一個轉盤。當我點擊一個標籤來隱藏第一個並顯示第二個時，第二個不會出現。檢查在Firefox的元件，我可以看到的class="flipster"下面<ul>沒有給出關於隱藏/顯示的高度或寬度：

HTML：

<div class="carousel-1"> 
    <h2>Carousel 1</h2> 
    <div class="flipster"> 
     <ul> 
     <li><img src="http://placehold.it/200x200" alt="" /></li> 
     <li><img src="http://placehold.it/200x200" alt="" /></li> 
     <li><img src="http://placehold.it/200x200" alt="" /></li> 
     <li><img src="http://placehold.it/200x200" alt="" /></li> 
     <li><img src="http://placehold.it/200x200" alt="" /></li> 
     </ul> 
    </div> 
    </div> 


    <p class="show-carousel-2">Click Me to toggle both carousels</p> 


    <div class="carousel-2"> 
    <h2>Carousel 2</h2> 
    <div class="flipster"> 
     <ul> 
     <li><img src="http://placehold.it/200x200" alt="" /></li> 
     <li><img src="http://placehold.it/200x200" alt="" /></li> 
     <li><img src="http://placehold.it/200x200" alt="" /></li> 
     <li><img src="http://placehold.it/200x200" alt="" /></li> 
     <li><img src="http://placehold.it/200x200" alt="" /></li> 
     </ul> 
    </div> 
    </div> 

腳本：

<script> 
    $(function() { 
     $(".flipster").flipster({ 
     style: 'carousel', 
     enableNav: false, 
     enableNavButtons: true, 
     start: 0 
     }); 
    }); 

    $(document).ready(function(){ 

     $(".carousel-2").hide(); 

     $(".show-carousel-2").click(function() { 
     $(".carousel-1").toggle("slow"); 
     $(".carousel-2").toggle("slow"); 
     }); 

    }); 
    </script> 

Plunker： http://plnkr.co/edit/mqclzHJ1lLZCgr4j23AR?p=preview

我甚至嘗試強制通過高度和寬度：

$(".js-inject-carousel-css").css({"height": "176px !important", "width": "140px !important"}); 

當添加class js-inject-carousel-css到<ul>

仍然沒有運氣

Answer 1

我發現這個問題，並解決了這個問題。

相反的：

$(".js-inject-carousel-css").css({"height": "176px !important", "width": "140px !important"}); 

我用：

$(".js-inject-carousel-css").css({"height": "176px", "width": "140px"}); 

基本上我刪除了!important。這是停止jQuery插入CSS值。