1

请我需要你的帮助伙计们!

我正在使用 Anythingslider 在 HTML5 视频和其他内容之间滑动,但是当我在视频标签中添加自动播放属性时,Anythingslider 只播放音频。

4

2 回答 2

0

您确定视频没有隐藏在另一个元素后面吗?使用 z-index 播放,因为视频应该可见。过去我遇到过一些问题,例如视频在滚动时忽明忽暗。

我最终在灯箱中播放视频,因为随着轮播继续滚动,任何滑块都会让视频播放。此外,如果您使用无限滚动条,在两个地方播放视频也会出现问题。

如果您使用的是 JW Player 之类的东西,您将能够设置一些操作来暂停幻灯片或类似视频上的视频,但基本的 youtube 嵌入将是一个问题。

于 2012-09-05T15:48:50.273 回答
0

不要将自动播放属性添加到 HTML5 视频。可能发生的情况是视频的克隆副本(仅限第一张和最后一张幻灯片)正在播放视频,但您听到的只是音频,因为面板不在视图中。您不想自动播放的原因是,即使 AnySlider 从另一张可见的幻灯片开始,它仍然会自动播放,并且在您循环浏览面板之前它不会停止。

如果您希望在面板可见时自动播放视频,您必须在完成的回调中添加一些脚本(下面的代码不需要视频扩展;演示):

var playvid = function(slider) {
    var vid = slider.$currentPage.find('video');
    if (vid.length) {
        // autoplay
        vid[0].play();
    }
};

$('#slider').anythingSlider({

    // Autoplay video in initial panel, if one exists
    onInitialized: function(e, slider) {
        playvid(slider);
    },
    // pause video when out of view
    onSlideInit: function(e, slider) {
        var vid = slider.$lastPage.find('video');
        if (vid.length && typeof(vid[0].pause) !== 'undefined') {
            vid[0].pause();
        }
    },
    // play video
    onSlideComplete: function(slider) {
        playvid(slider);
    },
    // pause slideshow if video is playing
    isVideoPlaying: function(slider) {
        var vid = slider.$currentPage.find('video');
        return (vid.length && typeof(vid[0].pause) !== 'undefined' && !vid[0].paused && !vid[0].ended);
    }

});​
于 2012-09-05T19:37:42.833 回答