Javascript 如何修复JQuery下拉菜单？

我试图在JQuery中创建一个下拉菜单，但事实证明这相当困难

我的代码在这里：

  $(document).ready(function(){

        $('ul li').mouseover(function()
        {
              $(this).children("ul").show();
        });
        $('ul li ul').mouseover(function()
        {
              $('ul li ul').show();
        }).mouseout(function(){
              $('ul li ul').hide();
        });

  });

基本上，我想将鼠标悬停在列表项上，然后将子菜单下拉，然后我可以将鼠标悬停在列表项上，如果鼠标离开子菜单，菜单将再次隐藏

谢谢， 基思

更新：我从CSS中删除了边框，效果很好，所以当我将鼠标悬停在1px边框上时，鼠标会被触发，这很奇怪

您应该使用，因为它避免了所有特定于sorta浏览器的问题

如果不进行任何测试，我可以想象代码看起来更像：

    $('.clearfix li').hover(function() {
          $('ul', this).show();
        }, function() {
          $('ul', this).hide();
        });

---

你知道吗？它是一个菜单jQuery插件，具有出色的跨浏览器支持。它肯定没有你正在经历的问题。我还没有检查源代码，但关键的区别是它在mouseout上增加了延迟。这意味着不会触发动作，除非光标位置稳定一段时间（默认延迟为800ms）。这将解决您的问题，也是一件很好的事情，因为它将使您的菜单更加用户友好。

问题是，边框“在”框之外。如果您只需将下拉菜单向上移动1个像素，使其与菜单栏重叠1个像素，则会有所帮助

只需将CSS中下拉菜单的顶部位置从30px更改为29px，如下所示：

        ul li ul {
            border: none;
            position: absolute;
            top: 29px; /* <-- was 30px */

ul-li-ul{
边界：无；
位置：绝对位置；
top:29px；/*在我的Firefox 1.5.0.1版本上运行良好。也许你没有最新版本。我自己运行一个图像库，但我认为这种布局对我来说不太合适，因为我对我的图像有描述，而且有些图像相当大。我不知道，可能值得尝试一下。
谢谢Scott.不幸的是，同样的问题。它在IEE中不起作用。是的，我一直在玩这个，它比我想象的要复杂得多。我会继续戳它-可能会出现一些东西：）谢谢。这似乎是最好的事情，虽然我仍然希望自己完全理解如何做。