title: jQuery UI how to set draggable containment option on parent's parent
body: <p>The jQuery UI Draggable interaction has a nice property for <a href="http://jqueryui.com/demos/draggable/#option-containment" rel="noreferrer">setting the containment</a> as the parent.  </p>
  
  <pre><code>$( ".selector" ).draggable({ containment: 'parent' });
  </code></pre>
  
  <p>I wish to set the containment as the parent's parent.  There is no string value to accomplish this, as string the options are  </p>
  
  <blockquote>
    <p>'parent', 'document', 'window', [x1, y1, x2, y2]</p>
  </blockquote>
  
  <p>I could calculate x1,y1,x2,y2 of the parent's parent at page load and use those values to set boundaries for a container relative to the document.  But the container position can change relative to the parent's parent position if the window is resized after page load.  The native 'parent' option keeps the draggable element within the parent element regardless of window resizing.</p>
  
  <p>Is there a way to accomplish this draggable containment using the parent's parent?
  .</p>