javascript - jQuery菜单从悬停时从屏幕底部向上滑动

我只想在屏幕底部显示固定的菜单项“音乐，新闻，联系人”。悬停时，我希望它们向上滑动并显示隐藏的内容。这就是我的意思：

http://sorendahljeppesen.dk/

请参阅屏幕底部。有人知道如何实现吗？谢谢。

附言还有，谁知道这是什么类型的MP3播放器？

最佳答案

将隐藏的内容放入div中，例如；

<div class="hiddenContent">...</div>

然后在页面底部给您的链接一个类，例如；

<a href="#" class="bottomLink">Music</a>

然后，当您将鼠标悬停在链接上时，告诉Jquery显示隐藏的内容；

$('.bottomLink').hover(
    function () {
        // Show hidden content IF it is not already showing
        if($('.hiddenContent').css('display') == 'none') {
            $('.hiddenContent').slideUp('slow');
        }
    },
    function () {
        // Do nothing when mouse leaves the link
        $.noop(); // Do Nothing
    }
);

// Close menu when mouse leaves Hidden Content
$('.hiddenContent').mouseleave(function () {
        $('.hiddenContent').slideDown('slow');
});