title: jQuery Draggable - get position
body: <p>:) I can't get the position ot objects relative to it's container. 
  I get only the position on whole page.Here is my code:</p>
  
  <pre><code>&lt;style&gt;
     .draggable { width: 150px; height: 0px; cursor:move; bottom: border:solid; border-color:#000; }
     &lt;?PHP if($userinfo-&gt;use_colors != '0'): ?&gt;
     #container { width: 450px; height:80px; background-color:&lt;?=$userinfo-&gt;background?&gt;; }
     &lt;?PHP else: ?&gt;
     #container { width: 450px; height:80px; background:url(/backgrounds/&lt;?=$userinfo-&gt;image?&gt;); }
     &lt;?PHP endif; ?&gt;
     &lt;/style&gt;
  &lt;script&gt;
     $(function() {
     $( "#draggable" ).draggable({ cursor: "move",containment: "#container", scroll: false,
     drag: function() {
     var position = $(this).position();
     var xPos = $(this).position().left;
     var yPos = $(this).position().top;
     $(this).text('x: ' + xPos + 'y: ' + yPos);
     }
                                              });
     $( "#draggable2" ).draggable({ cursor: "move",containment: "#container", scroll: false });
     $( "#draggable3" ).draggable({ cursor: "move",containment: "#container", scroll: false });
     $( "#draggable4" ).draggable({ cursor: "move",containment: "#container", scroll: false });
     });
     &lt;/script&gt;
  
  
  &lt;div id="container"&gt;
     &lt;div id="draggable" class="draggable" style="position:relative;top:0px;left:80px;"&gt;
     .::[ NowPlaying SIGnature ]::.
     &lt;/div&gt;
     &lt;div id="draggable2" class="draggable" style="position:relative;top:20px;left:80px;"&gt;
     Artist - title
     &lt;/div&gt;
     &lt;div id="draggable3" class="draggable" style="position:relative;top:40px;left:80px;"&gt;
     Album: (Year)
     &lt;/div&gt;
     &lt;div id="draggable4" class="draggable" style="position:relative;top:60px;left:80px;"&gt;
     Genre: 
     &lt;/div&gt;
  
  &lt;/div&gt;
  </code></pre>