2015-11-19 63 views
0

所以我現在有一個項目,基本上是化解bug,特別是這個項目是一個非常煩人的案例。 Flickity應該是「調整」<div>中的特定元素,並作爲底部的選項卡滾動到特定的信息元素。但是,所有的文字只是混合在一起。使用flickity來調整標籤的大小

Flickity issue

雖然在調整瀏覽器大小時,我發現它可以正常工作,並一次顯示一個<div>,並使用底部的按鈕在<div>之間切換。

這裏是jQuery的的flickity部分:

modalPopup(e, function() { 
       if ($(".key .active").not("#resetFilters").length) { 
        $(".button-group").find($(".key .active").data("filter")); 
       } 
       else { 
        $('.button-group li:first-child').addClass('is-selected'); 
       } 

       $('.button-group').on('click', 'li', function() { 
        var index = $(this).index(); 
        $(this).addClass('is-selected').siblings('.is-selected').removeClass('is-selected'); 
        gallery.flickity('select', index); 
       }); 

       var gallery = $('.chapters').flickity({ 
        // options 
        //imagesLoaded: true, 
        //percentPosition: false, 
        cellAlign: 'center', 
        contain: true, 
        prevNextButtons: false, 
        pageDots: false, 
        resize: true 
       }); 
      }); 

哪裏modalPopup()是加載在信息的功能。

任何幫助或建議,高度讚賞!

+0

它仍然不能在標籤中工作。如何做到這一點? – huykon225

+0

這是幾年前,我沒有訪問該代碼,我可以告訴你的唯一的事情就是在答案中描述的父元素上設置一個寬度。 – Twister1002

+0

我認爲這不是問題在這裏。例如https://codepen.io/huykon225/pen/ZJLOMR – huykon225

回答

0

我已經找到了這個問題。問題在於我最初使用CCS轉換的元素的寬度是0px寬度。 Flickity認爲父元素的寬度爲0px,因此不會展開其寬度元素。

因此,如果您使用CSS輕鬆調整大小的轉換,請確保您已定義寬度。

+0

它不適合我。 – huykon225

相關問題