猫头鹰旋转木马淡化效果不起作用

Zub*_*zob 14 javascript jquery owl-carousel

我正在尝试将淡化效果应用于猫头鹰旋转木马,但它似乎不起作用.

正如你在这个小提琴中看到的那样 - http://jsfiddle.net/lav911/fHa6J/,我正在加载transitions.css他们文档中提到的文件.

我错过了什么吗?为什么它会滑动而不是褪色?此外,请注意淡入淡出甚至在他们的网站上也不起作用.

稍后编辑:它似乎在谷歌Chrome 35和Firefox上淡出,但在谷歌Chrome 36上它会滑落.奇怪.

Zub*_*zob 14

据报道,插件的github回购显然是这样的 - https://github.com/OwlFonk/OwlCarousel/issues/346

只需使用此版本的插件(pull-request)修复它.

  • new:现在你可以使用版本2.4 http://www.owlcarousel.owlgraphic.com/index.html和animate.css来制作滑块过渡. (2认同)

Tom*_*mog 8

问题是owl插件在不支持CSS转换的浏览器中包含IE10和11.因此,您可以将owl carousel与Modernizr结合使用并替换"support3d"变量:

support3d = (asSupport !== null && asSupport.length === 1);
Run Code Online (Sandbox Code Playgroud)

同

support3d = (Modernizr.csstransforms3d);
Run Code Online (Sandbox Code Playgroud)

这似乎解决了它!:)


Mic*_*ård 5

由于chrome现在都支持-webkit-transform和transform属性,因此owl代码失败,因为如果返回的数组(转换样式)等于1,则3dsupport检测仅返回true,只需更改此行:

support3d = (asSupport !== null && asSupport.length === 1);
Run Code Online (Sandbox Code Playgroud)

到这一行:

support3d = (asSupport !== null && asSupport.length > 0);
Run Code Online (Sandbox Code Playgroud)

它应该工作;)