jquery - divをフェードアウトさせる最も簡単な方法

Question

寝不足なのかもしれませんが、よくわかりません。複数のビデオがあるページを作成しようとしていますが、その上に div があり、ビデオの読み込み中に突然表示され、フェードしますonClick。今日は以前にそれを持っていましたが、今は機能していません。関数の部分は

$('#hh').animate({
        opacity: 1
    }, 0, function() {
            myVideo.src = videos[numb];
        myVideo.load();
        myVideo.play();
     $('#hh').fadeOut(400);                                                        
    });

では、なぜこれが機能しないのでしょうか。

score 2 · Accepted Answer

$('#hh').show();
myVideo.src = videos[numb];
myVideo.load();
myVideo.play();
$('#hh').fadeOut(400);

score 1 · Accepted Answer

.fadeOut は、物事をフェードアウトさせる非常に簡単な方法です。

$('#clickme').click(function() {
  $('#book').fadeOut('slow', function() {
    // Animation complete.
  });
});

.fadeOut() メソッドは、一致した要素の不透明度をアニメーション化します。opacity が 0 に達すると、display style プロパティが none に設定されるため、要素はページのレイアウトに影響しなくなります。

期間はミリ秒単位で指定されます。値が大きいほどアニメーションが遅くなりますが、アニメーションが速くなるわけではありません。文字列 'fast' と 'slow' を指定して、それぞれ 200 ミリ秒と 600 ミリ秒の期間を示すことができます。他の文字列が指定されている場合、または期間パラメーターが省略されている場合は、デフォルトの期間である 400 ミリ秒が使用されます。

score 1 · Accepted Answer

$('TARGET').fadeOut(300); // TARGET is any valid selector

フェードアウト（）

   $('#hh').show('fast', function() {
         myVideo.src = videos[numb];
         myVideo.load();
         myVideo.play();
         $(this).fadeOut(400);                                                        
    });

また、使用できます

   $('#hh').fadeIn('fast', function() {
         myVideo.src = videos[numb];
         myVideo.load();
         myVideo.play();
         $(this).fadeOut(400);                                                        
    });

フェードイン（）

score 0 · Accepted Answer

フェードインを使用し、コールバックでビデオ src を変更し、ロードして再生し、最後にフェードアウトすることができます。それはうまくいくはずです

$('#hh').fadeIn(400, function () {
  myVideo.src = videos[numb];
  myVideo.load();
  myVideo.play();
  $(this).fadeOut(400);    
});

score 0 · Accepted Answer

コードを次のように置き換えることができます。

    $('#hh').fadeIn('slow', function() {

                   // Call Back Function 

                   myVideo.src = videos[numb];
                   myVideo.load();
                   myVideo.play();
                   $('#hh').fadeOut('slow');                            
        }                            
    });

しかし、私が理解していないことが 1 つあります。myVideo.play();

jquery - divをフェードアウトさせる最も簡単な方法

5 に答える 5

Related

Reference