0

所以，我有一个使图像不可见的功能，同时开始在它下面播放视频（6 个中的 1 个）。它工作得很好，div 淡出，并且可以播放。但是，它只在第一次工作。

有六个拇指（都是列表中的一个项目），它们每个都播放一个视频，对吧？因此，每次按下拇指时，我都需要图像恢复（快速）然后像它一样慢慢淡出。因此，每次点击都会进行各种小型重置。

代码是

$(document).ready(function () {

    $('li, .thumbs').on('click', function () {


        var numb = $(this).index(),
            videos = [
                'images/talking1.m4v',
                'images/talking2.m4v', 
                'images/talking1.m4v', 
                'images/talking2.m4v', 
                'images/talking1.m4v', 
                'images/talking2.m4v'
            ],
            myVideo = document.getElementById('myVid');
            myVideo.src = videos[numb];

        myVideo.load();
        $('#MyT').addClass('clear');
        myVideo.play();

    });

});

我试着洗牌，没有骰子。而且，是的，它应该在视频完成加载后开始褪色。这适用于 iPad，我还没有找到更好的方法来解决视频加载时出现的闪烁问题。

编辑：好的，试图用我能做到的最好的方式来解释......页面加载，并且您在顶部有图像。有六个缩略图，其中一个是单击的。视频加载时图像淡出（不必同步，只要视频先完成加载），然后播放。如果某个点，另一个拇指被按下，图像会弹出并淡出，以在视频加载时覆盖。基本上，每次点击都会重复第一次点击的情况。

4

1 回答 1

1

尝试以下方法检查视频何时结束：

$('#my_video_id').bind("ended", function(){ 
      alert('Video Ended'); 
      $('#MyT').removeClass('clear');
    });

取自http://help.videojs.com/discussions/questions/40-jquery-and-event-listeners

似乎对他们有用，所以如果你有类似的结果，请告诉我。

编辑

因此，当您单击缩略图时，您应该首先检查视频是否已经在播放，如评论部分的链接中所述。如果正在播放视频，请停止该视频并将“清除”类添加回该视频。然后你可以继续淡入第二个视频。我显然不能为你写所有这些，因为我不知道你拥有的所有条件、约束和 html 代码，但基本大纲就在那里。

于 2012-05-07T00:40:55.697 回答