3

3 つのボタンがあるページのセクションをプログラムしようとしています。各ボタンは現在のビデオをフェードアウトし、そのボタンに関連付けられたビデオの再生を開始する必要があります。そのビデオは、別のボタンをクリックするまで再生されます。別のボタンをクリックすると、フェードアウトして一時停止し、新しいビデオがフェードインして再生を開始します。フェードイン/フェードアウトをすべて配置しましたが、一時停止と再生機能の接続に問題があります。何か案は?

これが私がこれまで持っている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 () {

    }
);

このチュートリアルを見つけましたが、そのコードを私のコードに組み込む方法がわかりません。

4

1 に答える 1

3

これはあなたが探しているものですか?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();
});
于 2013-03-21T20:05:02.780 に答える