title: Cannot read property 'ui' of undefined
body: <p>I have applied the following jquery plugin for the tab user interface on my website.
  <a href="https://rawgit.com/adamjimenez/ui.tabs.overflowResize/master/demo/index.html" rel="nofollow">https://rawgit.com/adamjimenez/ui.tabs.overflowResize/master/demo/index.html</a></p>
  
  <p>i guess it's running on the old versions of the jquery.</p>
  
  <p>the website console is throwing some errors.</p>
  
  <pre><code>Uncaught TypeError: Cannot read property 'tabs' of undefined
  ui.tabs.closable.js:11 Uncaught TypeError: Cannot read property 'ui' of undefined
  ui.tabs.addTab.js:11 Uncaught TypeError: Cannot read property 'ui' of undefined
  jquery.min.js:3 Uncaught Error: no such method 'overflowResize' for tabs widget instance
  </code></pre>
  
  <p>here is the live site: <a href="http://lifeto.cafe24.com/xe/" rel="nofollow">http://lifeto.cafe24.com/xe/</a></p>
  
  <p>can anyone tell me what is causing the error and how to fix it?</p>
  
  <p>I have tried installing any other viable solution as well.</p>
  
  <p>but none seems to be working.</p>
  
  <p>this is the code :</p>
  
  <pre><code>jQuery(document).ready(function(){
   jQuery( ".tabpanel" ).tabs({closable: true, addTab:true}).tabs('overflowResize')
    .find( ".ui-tabs-nav" ).sortable({
    distance: 10
   });
  });
  </code></pre>
  
  <p>and the html:</p>
  
  <pre><code>&lt;div class="window_tab"&gt;
    &lt;div class="tabpanel"&gt;
      &lt;ul&gt;
          &lt;li&gt;&lt;a href="#tabs-1" class="closable"&gt;Tab 1&lt;/a&gt;&lt;/li&gt;
          &lt;li&gt;&lt;a href="#tabs-2" class="closable"&gt;Tab 2&lt;/a&gt;&lt;/li&gt;
          &lt;li&gt;&lt;a href="#tabs-3" class="closable"&gt;Tab 3&lt;/a&gt;&lt;/li&gt;
      &lt;/ul&gt;
      &lt;div id="tabs-1"&gt;
          &lt;p&gt;
              Content 1&lt;/p&gt;
      &lt;/div&gt;
      &lt;div id="tabs-2"&gt;
          &lt;p&gt;
              Content 2&lt;/p&gt;
      &lt;/div&gt;
      &lt;div id="tabs-3"&gt;
          &lt;p&gt;
              Content 3&lt;/p&gt;
      &lt;/div&gt;
   &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>the core function that i need is the function that i can close the tab, and reopen the specific tab when i click on the specific menu. and also they are supposed to be draggable so that i can change their order.</p>
  
  <p>i'd rather expect ways to make it working, not ways to go around or giving up.</p>
  
  <p>Thanks.</p>