悬停时自动暂停或播放HTML5视频-Java 学习之路

我正在尝试编写一个包含三个按钮的页面的一部分 . 每个按钮都应淡出当前视频并开始播放与该按钮相关的视频 . 该视频应播放，直到您点击另一个按钮，此时它会淡出并暂停，新视频会淡入并开始播放 . 我有fadeIn / fadeOut全部到位，但我有一些问题挂钩暂停和播放功能 . 有任何想法吗？

这是我到目前为止的jQuery：

$('.hover-text div[class^="slide"]').hover(
    function () {
        if (!$(this).hasClass('current')) {
          $('.slides div').fadeOut();
        };
        var class = $(this).attr('class');
        $('.slides div.' + class).fadeIn('slow');
        $('div[class^="slide"]').removeClass('current');
        $(this).addClass('current');

    },
    function () {

    }
);

我发现this tutorial，但我不确定如何将该代码合并到我的中 .

1 回答

这是你在找什么？ http://jsfiddle.net/pNbYq/4/

$('#button-holder a').hover(function(){
    var that = $(this);
    if(!$('#'+that.data('video')).is(':visible')){
        $('video:visible')[0].pause();
        $('video:visible').fadeOut('normal', function(){
            $('#'+that.data('video')).fadeIn('normal', function(){
                $('#'+that.data('video'))[0].play();
            });
        });
    }else{
        $('#'+that.data('video'))[0].play();
    }
}, function(){
    $('video:visible')[0].pause();
});

回复于 2024-04-19T11:32:01+08:00

悬停时自动暂停或播放HTML5视频

1 回答

相关问题