jQuery UI菜单位置不正确

Question

这是我的jsfiddle。 http://jsfiddle.net/jgreen/K6QSd/2/ 菜单似乎没有按照我的位置设定正确显示。

.menu({
    position: {
        my: "right top",
        at: "right bottom",
        of: $('#button1'),
        collision: "none"
    }
})

我想让菜单与按钮的右侧对齐，而不是目前的左侧对齐。

提前感谢您。

编辑：snowp提供了一种使用css实现该行为的方法，但我真正想知道的是为什么jquery ui不能实现这一点。

编辑＃2：我没有完全理解文档中的关键部分。position选项“标识<强>子菜单的位置...”。子菜单！=菜单。笨蛋。

- jgreen

Answer 1

@jgreen 您所需菜单的jQuery解决方案

 $(this).next().show().menu().position({

            my: "right top",
            at: "right bottom",
            of: $('#button1'),
            collision: "none" 
})

- snowp

---

@j08691 我添加了 jQuery 的解决方案，请检查一下。 - snowp

谢谢 @snowp 的帮助。有趣的是position选项无法正常工作，但它所模拟的ui方法可以。 - jgreen

Answer 2

请添加以下CSS，以创建类似于此菜单的效果：点击这里

  #subMenu
    {
        float:right; top:0px;right:-80px;
        z-index:1;
    }

(或者)

添加以下CSS代码，用于创建类似于此菜单 点击这里

#subMenu
{
   float:right; top:32px;right:40px;
}

- snowp

---

我正在尝试让菜单与按钮的右侧对齐，而不是目前左侧对齐的情况。您的解决方案仅仅是移动了菜单中的内容。 - j08691

就像@j08691所说，我不是试图将菜单中的内容向右移动。我正在尝试让菜单（保持其当前大小）与按钮的右侧对齐。 - jgreen

@j08691，我修改了我的答案，请检查一下。 - snowp

@snowp 谢谢您的回复。我已经赞同了您的答案，因为第二个确实得到了我想要的行为（只是使用了稍微不同的右侧和顶部值），但我没有将其标记为“答案”，因为它更像是一个 CSS 骗局，而非解决 jQuery UI 问题的方法（我已编辑我的答案，以明确我正在寻找 jQuery UI 解决方案）。 - jgreen

@j08691 我添加了 jQuery 的解决方案，请检查一下。 - snowp