Question

我正在使用cycle2插件，我有一个视频库，我想要的是显示当前幻灯片时，自动播放视频。

他确实有一个类似的插件，但看起来它只适用于youtube而我使用带有后备的视频html标签： http://jquery.malsup.com/cycle2/demo/video.php

显然我无法为视频添加自动播放，因为它们一次播放并且不确定如何处理。他的api url：http://jquery.malsup.com/cycle2/api/是否有办法解决？或者我必须从头开始创建一个函数，当选择某个滑块时，播放/停止。

我正在使用他网站上的哈希示例。

如果有任何想法可以从哪里开始，或者找到解决方案的正确方向，我会很感激，因为我已经看了几个小时了！

以下链接指示视频如何集成到cycle2滑块中的示例：

<video width="100%" height="100%" controls="controls">
  <source type="video/mp4" src="" />
  <source type="video/webm" src="" />
  <source type="video/ogg" src="" />
  <object width="100%" height="100%" type="application/x-shockwave-flash" data="">
  <param name="movie" value="" />
  <param name="flashvars" value="controls=true&file=" />
  </object>
</video>

插件网址：http://jquery.malsup.com/cycle2/demo/video.php

此网址可能有助于触发第一张幻灯片：https://github.com/malsup/cycle2/issues/25

Answer 1

我认为这样的事情应该有用。

//Triggered after the slideshow has completed transitioning to the next slide.
$( '#mySlideshow' ).on( 'cycle-after', function(event, optionHash, outgoingSlideEl, incomingSlideEl, forwardFlag) {
    $('video', incomingSlideEl)[0].play();
});

//Triggered just prior to a transition to a new slide.
$( '#mySlideshow' ).on( 'cycle-before', function(event, optionHash, outgoingSlideEl, incomingSlideEl, forwardFlag) {
    $('video', outgoingSlideEl)[0].pause();
});

滑块中的自动播放视频

1 个答案: