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輪播遇到了類似的問題，並且通過在shown的bootstrap模式事件中啟動owlCarousel來修復它。

如果您需要更多詳細信息，請告知我們，或者您已修復此問題。