2016-09-06 49 views
0

传送带在Edge或Chrome中无法响应,但在IE11中仍然响应的任何原因。转盘自身遵循响应式设计并对窗口大小的变化作出反应。只要旗帜放置在转盘上方,旗帜和转盘不响应。它们的大小不会改变,它是固定的。在IE11中,横幅和传送带根据窗口大小调整大小。传送带在IE11中响应,但在边缘或Chrome中不响应

owlCarousel版本是2.1.6

$('.owl-carousel-1').owlCarousel({ 
        loop:true, 
        margin:10, 
        navText:['<','>'], 
        autoplay:false, 
        autoplaySpeed:1000, 
        autoplayHoverPause:false, 
        responsiveClass:true, 
        responsiveBaseElement:window, 
        responsiveRefreshRate:100, 
        responsive:{ 
         0:{ 
          items:1, 
          nav:true 
         }, 
         600:{ 
          items:2, 
          nav:true 
         }, 
         1000:{ 
          items:3, 
          nav:true 
         } 
        } 
       }); 
+0

欢迎计算器。 IE在处理样式等方面很顽固。通常是这样的:在其他浏览器上工作的可能无法在IE中使用。所以我会说它的运气。对于一个好的答案,我们需要一个[mcve] – yezzz

回答

0

显然的问题是,旋转木马是一个柔性框内的一个专区内。一旦我给了div宽度:100%,它开始响应并很好地调整大小。宽度:100%不是IE所需要的。

这个工作在边缘,Chrome浏览器(仅用于演示内嵌样式):

<div id="content"> 
    <div class="Grid Grid--gutters Grid--holly-grail" style="display:flex"> 
    <div class="Grid-cell main" style="width: 100%;"> 
     <div class="article-box"> 
       <div id="article"> 
        <section id="intro-carousel"> 
         <div class="owl-carousel owl-loaded owl-drag" id="intro-banner-carousel"> 
         </div> 
        </section> 
       </div> 
     </div> 
    </div> 
    <div class="Grid-cell aside aside-2" id="right-column"> 
     <div id="action-links"> 
     </div> 
     <div class="article-box Demo2 Holly2" id="contact-details"> 
     </div> 
    </div> 
    </div> 
</div>