Bind a popup to another draggable popup relatively <p>I use a jQuery UI dialog in which there is another pop-up. </p> <pre class="lang-js prettyprint-override"><code>$("#dialog").dialog({ autoOpen: false, show: "blind", hide: "explode" }); $("#opener").click(function() { $("#dialog").dialog("open"); return false; }); // BUTTONS $('.fg-button').hover(function() { $(this).removeClass('ui-state-default').addClass('ui-state-focus'); }, function() { $(this).removeClass('ui-state-focus').addClass('ui-state-default'); }); // MENUS $('#hierarchybreadcrumb').menu({ content: $('#hierarchybreadcrumb').next().html(), backLink: false }); </code></pre> <p>See here the live version: <a href="http://jsfiddle.net/nrWug/1" rel="nofollow">http://jsfiddle.net/nrWug/1</a></p> <p>If I open the iPod menu and than drag the dialog, the iPod menu is displaced. How can I bind these two to make the dialog draggable and resizable?</p>