为什么我的猫头鹰项目的宽度= 0px

时间:2014-08-11 10:10:00

标签: css owl-carousel

当我尝试将其与网站合并时,我遇到了owl-carousel的问题,尽管它在我的独立原型中运行良好。基本上owl-wrapper和所有owl-item实例的宽度设置为0内联,我无法解决原因。

如果我手动移除这些物品的宽度,它不会修理旋转木马(虽然我不确定我是否也预料到了)。我使用了一个相当基本的owl-carousel设置:

// Setup the owl-carousel slider once the document has loaded
$(document).ready(function () {
    $("#owl-slider").owlCarousel({
        autoPlay: 5000, //Set AutoPlay to 5 seconds
        singleItem: true,
        lazyLoad: true,
        lazyEffect: false
    });
})

如果您访问this page,则可以在DOM中搜索owl-slider并看到此输出显然是错误的:

enter image description here

我尝试了各种各样的东西,懒惰加载图片,使用lorem像素而不是嵌入的图片,但似乎无法修复网站。然而,我在这里有一个完美的原型JSFiddle。任何人都可以为我提供解决方案或一些有关继续尝试的建议吗?

1 个答案:

答案 0 :(得分:1)

似乎在包含div float:left的owl轮播上使用.sliderBox会导致您的问题。

删除此样式或设置.sliderBox div的宽度可以解决您的问题。