Integrating jQuery UI Selectable and SuperFish

[Vel]

I have a CMS system that uses SuperFish to build the menu on the front end. On the back end one of the most common comments we received was users found it hard to relate the back end menu to the front end menu. Our solution, make an editable copy of the front end menu in the back end. This involved combining the jQuery UI selectable feature with a SuperFish menu.

 

The initial integration works great. I have a menu bar with 2 tiers of drop down menus on them and I can move items around on the menu fine. I can select an item in a child menu and move it to it's parent fine, however I can't move an item to a child menu because whilst the drag feature is functioning hovering over a SuperFish menu doesn't open it.

 

What I need to do is try to find a suitable way to open all the child menus when select is active. I thought something like this would work:

 start: function(event, ui) {
$('ul.main-menu').showSuperfishUl();
}, 
stop: function(event, ui) {
$('ul.main-menu').hideSuperfishUl();
}

However that just creates an ever increasing number of white spaces every time I move my mouse whilst dragging an item in a menu. Is there a way to open all of the child menus of the active select menu?