OWL Carousel图像最初尺寸不合适

Question

我正在使用OWL Carousel并且我已对它进行编码,因此将显示一个图像,然后每隔15秒将下一个图像滑入.我已将宽度设置为屏幕的100%,因此在理论上对js进行了适当的编码应该有一个图像,一次全尺寸....但是会发生什么是它显示所有的图像相当小,然后如果我调整屏幕甚至1像素,它捕捉它应该如何.....

有关如何避免必须调整屏幕大小以使图像全尺寸的任何想法？

这是我的HTML

<div class="owl-carousel">
    <img src="assets/background1.jpg" />
    <img src="assets/background2.jpg" />
    <img src="assets/background3.jpg" />
</div>

这是我的js

var owl = $('.owl-carousel');
owl.owlCarousel({
    singleItem: true,
    items:1,
    loop:true,
    margin:10,
    autoplay:true,
    autoplayTimeout:15000,
    autoplayHoverPause:true


});
$('.play').on('click',function(){
    owl.trigger('autoplay.play.owl',[1000])
})
$('.stop').on('click',function(){
owl.trigger('autoplay.stop.owl')
})

Answer 1

原因可能是以下之一:

1. 要么在加载DOM之前调用owl.owlCarousel方法.因此,请尝试在文档准备中启动它.
2. 或者.owl-carousel div可能位于加载DOM时不可见的容器内.

我在启动模式中使用owl carousel遇到了类似的问题,并且在bootstrap模式的情况下通过启动owlCarousel来修复它shown.

如果您需要更多详细信息,请告知我们,或者您已修复此问题.