Make an entire element draggable but not everything causes the drag

I have the following element in HTML:

<div class="window" iname="win0">
<div class="title" prop="title">
</div>
<div class="content" prop="form">
</div>
</div>

I want the whole element to able to be dragged, but only if they are clicking on the div element with the 'title' class. Basically, it is supposed to appear as a normal windows 开发者_StackOverflow中文版application form. I set just it as draggable but then only that element dragged instead of it and its parent (which is understandable). I'm using JQuery and The JQuery UI as well so anything utilizing those things are welcome.

Thanks if you can!

You can use the handle option:

$(".window").draggable({
    // your options,
    handle: ".title"
});

See the doc for that, handles are what you're looking for : http://jqueryui.com/demos/draggable/#handle