1

JSAPIを使用してカスタムYouTubeプレーヤーを作成しました。プレーヤーからマウスアウトするときにプレーヤーコントロールをフェードアウトし、プレーヤーにマウスインするときにフェイスインしようとしています。

以下は私が使用したjQueryコードです。

$("#video-container, #ytPlayer").on('mouseover', function(){
    $('#video-controls').fadeIn(500);
}).on('mouseout', function() {
    $('#video-controls').fadeOut(500);
});

デモURL：http ://staging.xhtml-lab.com/tik-o-talk/

マウスイベントが正しく機能していません。何か提案がありますか？

4

1 に答える 1

2 
$("#video-container, #ytPlayer").on('mouseenter mouseleave', function( e ){
    var fadeOpacity = e.type == 'mouseenter' ? 1 : 0 ;
    $('#video-controls').stop().fadeTo( 500, fadeOpacity  );
});

Mouseenterとmouseoutはメソッドの兄弟であり、アニメーションキューをクリアするhoverために少し追加するよりも、要素の入力/削除イベントに対してより信頼性が高く、素晴らしいメソッドはレシピのチェリーになるはずです。.stop()fadeTo()

于 2013-02-10T06:05:45.317 に答える