title: Bootstrap draggable panel
body: <p>I made a bootstrap panel through following code </p>
  
  <pre><code>&lt;div class="panel panel-default"&gt;
    &lt;div class="panel-heading clearfix" id="drag"&gt;An explorer panel&lt;/div&gt;
    &lt;div class="panel-body"&gt;I want to be dragabble&lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>and the styling is</p>
  
  <pre><code>#drag {
  cursor: move;
  }
  </code></pre>
  
  <p>I tried using jquery code to make the panel draggable as shown at <a href="https://www.w3schools.com/howto/tryit.asp?filename=tryhow_js_draggable" rel="nofollow noreferrer">https://www.w3schools.com/howto/tryit.asp?filename=tryhow_js_draggable</a></p>
  
  <pre><code>(".panel").draggable();
  </code></pre>
  
  <p>but it did not work and returned a "Type Error: No such function .draggable()"
  So is there any other alternative to create a draggable panels using bootstrap thanks in advance</p>