猫头鹰轮播：在平板电脑视图上闪烁答案

【问题标题】：owl carousel: flickering on tablet view猫头鹰轮播：在平板电脑视图上闪烁
【发布时间】：2016-07-27 21:25:01
【问题描述】：

我们正在实施 owl carousel 在所有分辨率的桌面视图上都可以，但在平板电脑视图 (ipad) 上闪烁包含该 owl carousel 的完整页面。

HTML 代码：

<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代码：

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
                        }
                    }
                });

注意：如果我们删除那个猫头鹰轮播，那么页面就可以正常工作了。 我们不希望在 ipad (tabletview) 上出现这种闪烁，为什么会出现这种情况？任何解决方案？请提出建议。

（使用的猫头鹰轮播版本：2.0.0 版）

【问题讨论】：

请务必阅读标签说明。这与 Web 本体语言 owl 无关。它通常有助于添加语言标签（例如，javascript）和主要库标签（例如，jquery）。我已经相应地编辑了标签。

标签： javascript jquery html owl-carousel

【解决方案1】：

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

请把上面的代码添加到你的css文件中，看看类是用html代码定义的...

这对我来说很好......

【讨论】：