如何在jquery ui菜單中重新定位子菜單？

我需要我的菜單出現如下圖所示：如何在jquery ui菜單中重新定位子菜單？

| Menu 1 | -> | Sub menu of menu 1 - 1 | 
| Menu 2 | | Sub menu of menu 1 - 2 | 
| Menu 3 | | Sub menu of menu 1 - 3 | 

| Menu 1 | | Sub menu of menu 2 - 1 | 
| Menu 2 | -> | Sub menu of menu 2 - 2 | 
| Menu 3 | | Sub menu of menu 2 - 3 | 

| Menu 1 | | Sub menu of menu 2 - 1 | | Sub menu of menu 2 - 2 - 1 | 
| Menu 2 | -> | Sub menu of menu 2 - 2 | -> | Sub menu of menu 2 - 2 - 2 | 
| Menu 3 | | Sub menu of menu 2 - 3 | | Sub menu of menu 2 - 2 - 3 |

我使用jQuery UI的菜單控件的下方位置（）選項，但似乎並沒有達到我想要的。

$("#menu").menu({position: { my: "left top", at: "right top" , collision: "flip " } });

而且我不知道如何使用

$(".selector").menu("option", "position", { my: "left top", at: "right-5 top+5" });

（以上內容來自http://api.jqueryui.com/menu/#option-position採取線）

什麼是不工作對我來說：http://jsfiddle.net/R4Y2E/1/show/

我是什麼試圖實現：http://jsfiddle.net/2zA6A/4/show/（稍微遠離li上的鏈接以查看子菜單重新定位到父菜單的頂部）

有關如何使用此方法的任何幫助或建議？

來源

2014-02-28 code.tweetie

所以你已經發布你想要什麼來實現，但你還沒有表現出多麼的失敗。要麼張貼或更好，但張貼jsfiddle說明問題。 :) – Rooster

我想通了，以重新使用對焦&選擇事件的子菜單（如下）：http://jsfiddle.net/2zA6A/6/

$(function() { 

var menuBar; 
    menuBar = $("#menu"); 

    menuBar.menu(
     { 
      focus: function (event, ui) { 
       menuBar.menu("option", "position", { of: $(ui.item.parent()), my: "left top", at: "right top" }); 
      } 
     } 
    ) 

});

來源

2014-03-03 16:16:16

如何在jquery ui菜單中重新定位子菜單？

回答

相關問題