创建JQuery菜单弹出窗口

有人能告诉我如何用下面的图片创建这个菜单弹出窗口的最佳方法吗

下一幅图显示了当您将鼠标悬停在“更多”链接上时它的外观。 我有一个图像弹出菜单

<script type="text/javascript">  
    $(function() {
        $(this).find('#more_ddown').hide();
    });

    $(function() {
        $('#v3NavHeaderLink3').hover(function(){                    
            $('#more_ddown').fadeIn('fast');                        
            }, function(){
                $('#more_ddown').hide();
            });
        });

</script>

    <nav id="NavHeader">
        <a href="#" title="" id="Link1">Link #1</a>
        <a href="#" title="" id="Link2">Link #2</a>
        <a href="#" title="" id="Link3">More</a>
        <img src="img/more.png" id="more_ddown" alt="alt" />    
    </nav>

$（函数（）{
$（this.find（'more#ddown'）.hide（）；
});
$（函数（）{
$（'#v3NavHeaderLink3'）。悬停（函数（）{
$（'more#ddown'）。fadeIn（'fast'）；
}，函数（）{
$（'more#ddown'）.hide（）；
});
});

HTML

*/太长了，不能放在这里

JQUERY

$("#moreButton").bind('mouseover',function(){
              $('#morePopup').css('display','block');
});
$("#morePopup").bind('mouseout',function(){
        $(this).css('display','none');
});

---

你能把你目前掌握的密码贴出来吗？这就是我的想法。css和html可能不是100%准确，但其方向正确悬停似乎不起作用，当我离开链接时，如何保持下拉列表仍然可见？干杯，你可以用模糊显示隐藏。至于搬走的话，就这么做吧$（“#moreButton”）.bind（'mouseover'，function（）{$（'#morepoppopup'）.css（'display'，'block'）；}）$（“#moreButton”）.bind（'mouseout'，function（）{$（“#morepoppup”）.css（'display'，'none'）；}）；我也刚刚编辑了这篇文章。如果有效，请告诉我。：）最后使用了jquery的“mouseover”和“mouseleave”功能。

#morePopup
{
  display:none;
  position:absolute;
  left:/*whatever you want*/
  top:/*whatever you want*/
  width:/*whatever you want*/
  height:/*whatever you want*/
}
#heading
{
  display:block;
  width:/*same as morePopup*/
  height:/*whatever you want*/
}

$("#moreButton").bind('mouseover',function(){
              $('#morePopup').css('display','block');
});
$("#morePopup").bind('mouseout',function(){
        $(this).css('display','none');
});