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

做

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

不行？

此外，如果您使用的是 jQuery 1.7+，请使用

$('#jp_player_1').on({
    mouseenter: function(){...},
    mouseleave: function(){...}
});
于 2012-04-16T00:48:16.080 回答
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 回答