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

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

  •  0
  • ultraloveninja  · 技术社区  · 6 年前

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

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

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

    1 回复  |  直到 6 年前
        1
  •  0
  •   Community CDub    5 年前

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

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

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