Enable video option:
video:true
要在carousel中添加video只需要加入<a class="owl-video" href="_straight URL from youtube or vimeo"></a>
。
标签不是强制性的,你可以使用其它的标签,但是"owl-video"和url链接中的href属性是必须的。
Additional video options:
videoWidth: false, // Default false; Type: Boolean/Number
videoHeight: false, // Default false; Type: Boolean/Number
$('.owl-carousel').owlCarousel({
items:1,
merge:true,
loop:true,
margin:10,
video:true,
lazyLoad:true,
center:true,
responsive:{
480:{
items:2
},
600:{
items:4
}
}
})
<div class="owl-carousel">
<div class="item-video" data-merge="3"><a class="owl-video" href="http://vimeo.com/23924346"></a></div>
<div class="item-video" data-merge="1"><a class="owl-video" href="https://www.youtube.com/watch?v=JpxsRwnRwCQ"></a></div>
<div class="item-video" data-merge="2"><a class="owl-video" href="http://www.youtube.com/watch?v=FBu_jxT1PkA"></a></div>
<div class="item-video" data-merge="1"><a class="owl-video" href="http://www.youtube.com/watch?v=oy18DJwy5lI"></a></div>
<div class="item-video" data-merge="2"><a class="owl-video" href="http://www.youtube.com/watch?v=H3jLkJrhHKQ"></a></div>
<div class="item-video" data-merge="3"><a class="owl-video" href="https://www.youtube.com/watch?v=g3J4VxWIM6s"></a></div>
<div class="item-video" data-merge="1"><a class="owl-video" href="http://www.youtube.com/watch?v=0fhoIate4qI"></a></div>
<div class="item-video" data-merge="2"><a class="owl-video" href="https://www.youtube.com/watch?v=EF_kj2ojZaE"></a></div>
</div>