1

プレーヤーとプレイリストがあるプロジェクトに取り組んでいます。今、プレーヤー自体にカーソルを合わせると、プレイリストを表示/非表示にしたいと考えています。リンクにカーソルを合わせると、プレイリストを非表示/表示できるようになりました。プレイリストのフェードアウトにも遅延を設定しましたが、問題は、カーソルがプレイリスト自体にある場合にコマンドを停止することです。マウスを外に移動すると、マウスが消えるはずです。http://cpanel12.proisp.no/~annaryuh/player/annar.htmで何が起こるか見てみましょう。

これは私が今持っているスクリプトです:

$(document).ready(function(){

    $(".jp-playlist").hide();
    $(".show_hide").show();

    $('.show_hide').hover(function(){
        jQuery('.jp-playlist').delay(200).fadeIn();
        }, function() {
        jQuery('.jp-playlist').delay(1000).fadeOut();  
    });

});

これはテスト ページへのリンクです: http://cpanel12.proisp.no/~annaryuh/player/annar.htm

4

3 に答える 3

0

setTimeout 関数を使用します。

var fadeOutFunction;
var fadeInFunction;

$(document).ready(function(){

    $(".jp-playlist").hide();
    $(".show_hide").show();

    $('.show_hide').hover(function(){
        clearTimeout(fadeOutFunction);
        fadeInFunction = setTimeout(function(){jQuery('.jp-playlist').fadeIn(); },200);
        }, function() {
        clearTimeout(fadeInFunction);
        fadeInFunction = setTimeout(function(){jQuery('.jp-playlist').fadeOut();}, 1000);  
    });

});

また、カーソルがプレイリスト自体にある場合にコマンドを停止する場合は、プレイリストの onhover イベントに clearTimeout を追加するだけです。

于 2012-04-16T00:53:20.920 に答える
0

私はあなたが何を望んでいるのか理解していると思います.リンクはプレイリストを開閉し、ボックスからマウスを動かすとプレイリストが閉じます.

してみてください：

http://jsfiddle.net/YupEe/5/

于 2012-04-16T01:02:31.547 に答える
0

する

$('#jp_player_1').hover({...});

うまくいかない？

また、jQuery 1.7 以降を使用している場合は、

$('#jp_player_1').on({
    mouseenter: function(){...},
    mouseleave: function(){...}
});
于 2012-04-16T00:48:16.080 に答える