0

我正在制作一个显示左侧或右侧下拉菜单的大型菜单，到目前为止我无法正确计算 offset.left 并且它具有不同的不同分辨率。

所以我想到了在右侧显示第一个和第二个下拉菜单并在左侧休息，但我不确定如何使第 n 个子元素在 if 语句上工作。

简单的小提琴示例http://jsfiddle.net/42MfQ/1/

我的超级菜单示例显示为这个在此处输入图像描述 超级菜单的实际小提琴示例http://jsfiddle.net/5eecT/13/

我将不胜感激帮助使此脚本正确显示菜单。

现在这段代码不能正常工作

if (($(this).offset().left) + 200 > $('.menu-wrapper').width()) {
    $(this).find(".dropdown").addClass("dropdown-last");
}

出于这个原因，我虽然会在右侧和左侧的其余部分显示第一个、第二个下拉菜单，这将避免上述代码计算的自动检测。

我不确定如何编写此代码

   if($( "li:nth-child(1)" ) == true || "li:nth-child(2)" == true ))
   {
     alert('show dd menu on right side of parent menu');  
   }

else { alert('在父菜单左侧显示 dd 菜单');
}

4

1 回答 1

0

我只是决定使用以下 jquery 使其适用于任何意外结果。

这个简单的添加一个 dropdown-last在文本左侧对齐子菜单的类。下面是一个示例，您可以使用它来使其以想要的方式工作

$("#menu").on("mouseenter", ":nth-child(4)", function () { $(this).find(".dropdown").addClass("dropdown-last"); });
$("#menu").on("mouseenter", ":nth-child(5)", function () { $(this).find(".dropdown").addClass("dropdown-last"); });
$("#menu").on("mouseenter", ":nth-child(6)", function () { $(this).find(".dropdown").addClass("dropdown-last"); });

由于以下 jQuery 在不同的屏幕分辨率上给了我意想不到的结果。

    if (($(this).offset().left) + 200 > $('.menu-wrapper').width()) {
        $(this).find(".dropdown").addClass("dropdown-last");
    }
于 2013-10-20T10:07:17.643 回答