title: jQuerymobile nativedroid2 Tabs swipe
body: <pre><code>&lt;div data-role="header" data-position="fixed" class="wow fadeIn"&gt;
              &lt;a href="#leftpanel" class="ui-btn ui-btn-left"&gt;&lt;i class="zmdi zmdi-menu"&gt;&lt;/i&gt;&lt;/a&gt;
              &lt;h1 class="wow fadeIn" data-wow-delay='0.4s'&gt;Tabs&lt;/h1&gt;
  
              &lt;ul data-role="nd2tabs" &gt;
                  &lt;li data-tab="friends"&gt;Friends&lt;/li&gt;
                  &lt;li data-tab="work" data-tab-active="true"&gt;Work&lt;/li&gt;
                  &lt;li data-tab="holiday"&gt;Holiday&lt;/li&gt;
                  &lt;li data-tab="colors"&gt;Colors&lt;/li&gt;
              &lt;/ul&gt;
  
          &lt;/div&gt;
  </code></pre>
  
  <p>I have nativeDroid2b Tabs jquerymobile material design from <a href="http://nd2.godesign.ch/examples/extended/tabs.html" rel="nofollow noreferrer">natriveDroid2/Tabs</a>.</p>
  
  <p>How can I enable swipe feature in this tabs (ie switch between tabs content).</p>
  
  <p>I wrote code for this, but it's not working:</p>
  
  <pre><code>$(function () {
              function changeNavTab(left) {
                  var $tabs = $("div[data-role=nd2tabs] li ", $("div[data-role=nd2tabs].nd2Tabs-active"));
                  var curidx = $tabs.closest("li.nd2Tabs-active").parent().index();
                  console.log($tabs);
                  var nextidx = 0;
                  if (left) {
                      nextidx = (curidx == $tabs.length - 1) ? 0 : curidx + 1;
                  } else {
                      nextidx = (curidx == 0) ? $tabs.length - 1 : curidx - 1;
                  }
                  $tabs.eq(nextidx).click();
              }
  
              $("div[role=main]").on("swipeleft", function (event) {
  
                  changeNavTab(true);
              });
  
              $("div[role=main]").on("swiperight", function (event) {
  
                  changeNavTab(false);
              });
          });
  </code></pre>
  
  <p>Kindly help me, thanks in advance.</p>