<div data-role="draggable"></div>

                <div id="area1">
                    <div data-role="draggable" data-drag-area="#area1"></div>
                </div>
            

                <!--Draggable panel-->
                <div class="panel" data-role="draggable">
                    <div class="heading">
                        <span class="icon mif-home"></span>
                        <span class="title">Panel Title</span>
                    </div>
                    <div class="content">
                        Lorem ipsum dolor sit amet, consectetur adipiscing elit.
                    </div>
                </div>

                <!--Draggable panel on heading-->
                <div class="panel" data-role="draggable" data-drag-element=".heading">
                    <div class="heading">
                        <span class="icon mif-home"></span>
                        <span class="title">Panel Title</span>
                    </div>
                    <div class="content">
                        Lorem ipsum dolor sit amet, consectetur adipiscing elit.
                    </div>
                </div>
            

Draggable dialog

                <div data-role="dialog,draggable" class="dialog" data-close-button="true">
                    <h1>Simple dialog</h1>
                    <p>
                        Dialog :: Metro UI CSS - The front-end framework for
                        developing projects on the web in Windows Metro Style
                    </p>
                </div>