title: jQuery drag an element when mousedown event on its child element
body: <p>I am kinda new in jquery and im facing a problem to drag an element if i click on its child element.</p>
  
  <pre><code>HTML
  &lt;div class="floatingPanel"&gt;
      &lt;div class="dragger"&gt;
          Drag from here
      &lt;/div&gt;
  &lt;/div&gt;
  
  JQUERY 
  $(document).ready(function () {
      $('.dragger').mousedown(function () {
          $('.floatingPanel').draggable({
              opacity: 0.35
          });
      }).mouseup(function () {
          alert("mouse up");
      });
  });
  </code></pre>
  
  <p>If i click on '.floatingPanel' area, It's still dragging. Where do I do wrong here?
  the example is here: <a href="http://jsfiddle.net/6g6Xr/23/" rel="nofollow">http://jsfiddle.net/6g6Xr/23/</a></p>
  
  <p><strong>OK, Its solved, thanks to Polmonite for <a href="http://jsfiddle.net/6g6Xr/28/" rel="nofollow">http://jsfiddle.net/6g6Xr/28/</a></strong></p>