Eulenkarussell: Flackern auf Tablet-Bildschirm

Question

Wir implementieren Eulenkarussell Es ist in Ordnung auf Desktop-Ansicht auf alle Auflösungen, aber flackern komplette Seite, die das Eulenkarussell auf Tablet-Ansicht (ipad) enthält.

HTML-Code:

<div class="col-md-12"> 
       <div class="row"> 
        <div class="text-center" id='answersheet_status'></div> 
        <div class="col-sm-12 col-md-12"> 
         <div class="text-center" id='assessment_feedback'> 
          <!--<a href="#" class="pull-right close-btn-assessment" id="close_btn_assessment"><i class="fa fa-times">y</i></a>--> 
         </div>      
        </div> 
       </div> 
       <div class="row" id="main_div_section"> 
        <div class="col-md-12 question-section"> 
         <div id="section_div" class="col-md-12 owl-carousel owl-theme" style="padding:0 20px;"></div> 
        </div> 
       </div> 
       <div class="alernate_div_section hide" id="alernate_div_section"></div> 
       <div class="col-md-12 no-padding mt15"> 
        <div class="row"> 
         <div class="col-sm-12 col-md-12"> 
          <div class="section-result"></div> 
          <div class="col-md-12 no-padding mt15" id="questions_div">       
          </div> 
          <div class="clearfix"></div> 
          <div class="question-footer"></div> 
         </div> 
        </div> 
       </div> 
      </div> 

Js Code:

var carousel = $('.owl-carousel'); 
    carousel.owlCarousel({ 
        rtl: false, 
        margin: 10, 
        nav: true, 
        loop: false, 
        mergeFit: true, 
        startPosition: start_pos, 
        responsive: { 
         0: { 
          items: 1 
         }, 
         600: { 
          items: 3 
         }, 
         1000: { 
          items: 3 
         }, 
         1200: { 
          items: 4 
         }, 
         1400: { 
          items: 5 
         } 
        } 
       }); 

Hinweis: Wenn wir diese Eule Karussell entfernen, dann die Seite funktioniert überhaupt in Ordnung. Wir wollen das nicht flackern auf iPad (Tabletview), warum das passiert? irgendeine Lösungsmöglichkeit? bitte vorschlagen.

(Eule Karussell Version verwendet: Version 2.0.0)

Answer 1

.owl-carousel .owl-wrapper-outer{ 
    overflow: hidden; 
    position: relative; 
    width: 100%; 
    z-index: 1; // added this 
} 

Bitte fügen Sie den obigen Code in Ihrer CSS-Datei, und sehen Sie, dass die Klasse definiert, ist in HTML-Code ...

Das funktioniert gut mit mir ....