有没有办法强制jQuery UI菜单子菜单总是定位而不是向下？

Question

我有洁癖的标题栏一个简单的jQuery UI菜单：

<div style="width: 100%; min-height: 100px;"></div> 
<ul id="menu" style="width: 100px;"> 
    <li><a href="#">Item 1</a></li> 
    <li><a href="#">Item 2</a></li> 
    <li><a href="#">Item 3</a> 
    <ul> 
     <li><a href="#">Item 3-1</a></li> 
     <li><a href="#">Item 3-2</a></li> 
     <li><a href="#">Item 3-3</a></li> 
     <li><a href="#">Item 3-4</a></li> 
     <li><a href="#">Item 3-5</a></li> 
    </ul> 
    </li> 
    <li><a href="#">Item 4</a></li> 
    <li><a href="#">Item 5</a></li> 
</ul> 

<script type="text/javascript"> 
    $(document).ready(function(){ 
     $("#menu").menu(); 
    }); 
</script> 

小提琴这里：http://jsfiddle.net/uW44Y/

有没有一种方法，我可以强制子菜单，从项目3至总是打开了从它的标题而不是向下？

Answer 1

jQuery的UI菜单API支持position属性：http://api.jqueryui.com/menu/#option-position。尝试类似$("#menu").menu({position: {my: 'left bottom', at: 'top right'}});

Answer 2

您可以使用jQuery position选项来设置子菜单的位置。

编号：

标识相对于相关 父菜单项子菜单的位置。 of选项默认为父菜单项，但您可以指定另一个元素来定位。您可以参考 jQuery UI Position实用程序获取有关各种 选项的更多详细信息。

jQuery UI的位置：http://api.jqueryui.com/position/

代码：

$("#menu").menu({ 
    position: { 
     my: 'left bottom', 
     at: 'right bottom' 
    } 
}); 

演示：http://jsfiddle.net/89Wpf/