代码之家 › 专栏 › 技术社区 › ultraloveninja

在滑块中暂停HTML5视频(flickity)

flickity carousel video jquery javascript

ultraloveninja · 技术社区 · 8 年前

我目前正在将一些幻灯片添加到一个滑块中(使用flicky),由于某些原因,当滑块移动到下一个幻灯片时,当事件发生变化时,我可以让第一个视频暂停。但如果我在下一张幻灯片中播放下一个视频,然后再移回上一张或下一张幻灯片,视频将不会暂停。

var testimonials = $('.case-studies__testimonial-group');
testimonials.on( 'select.flickity', function( event, index ) {
      $(".testimonial-item .content-vid").get(0).pause();
});

奇怪的是,当事件发生变化时,它对第一个有效,但对第二个却不起作用。我觉得这跟第一个视频已经暂停,而不是暂停第二个视频的滑块变化有关?我不确定是否还有其他需要我寻找的东西。

1 回复 | 直到 8 年前

Community Mohan Dere 6 年前

好吧,再把它弄得一团糟之后,它似乎起作用了:

var testimonials = $('.case-studies__testimonial-group');
testimonials.on( 'select.flickity', function( event, index ) {
      $  $('.testimonial-item').find('video').each(function() {
            this.pause();
        });
});

基本上,当它在flicky中启动事件更改时,它将找到视频并立即暂停。如果它暂停了所有的视频,那就没问题了,因为不管怎样,这都是预期的目的。