title: How can i add Scrollbar to nav-tab Contents?
body: <p>I am using lionbars scrollbar plugins for overlay scrollbar and i want to apply scrollbar to content but unfortunately its not showing. Below is my snippets for reference and help me to solve the issue.</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>$(document).ready(function(){
    $('#activity, #locations').lionbars({
      autohide: true
    }); 
  });</code></pre>
  <pre class="snippet-code-css lang-css prettyprint-override"><code>.right-sidebar-wrapper{  
    position: absolute;
    right: 0;
    width: 24%;
    top:0;
    bottom: 0;
    height: 100%;  
    background: #FFF;  
    box-shadow: 0 -1px 24px rgba(0,0,0,0.4);
    z-index: 1;
  }
  #r-s-tab{
    display: inline-block;
    height: 80%;  
    width: 100%;
    margin-bottom: 10px;
  }
  #r-s-tab #activity a, #r-s-tab #locations a{  
    padding-top: 8px;
    border-radius: 3px;
    display: block;
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.css" rel="stylesheet"/&gt;
  &lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"&gt;&lt;/script&gt;
  &lt;script src="http://bootswatch.com/bower_components/bootstrap/dist/js/bootstrap.min.js"&gt;&lt;/script&gt;
  &lt;link href="http://bootswatch.com/paper/bootstrap.min.css" rel="stylesheet"/&gt;
  &lt;link href="http://charuru.github.io/lionbars/css/lionbars.css" rel="stylesheet"/&gt;
  &lt;script src="http://charuru.github.io/lionbars/js/jquery.lionbars.0.3.js"&gt;&lt;/script&gt;
  
  &lt;div class="right-sidebar-wrapper"&gt;
  &lt;div class="right-nav"&gt;
    &lt;ul class="nav nav-tabs"&gt;
      &lt;li class="active"&gt;&lt;a href="#activity" class="text-center" data-toggle="tab"&gt;&lt;!-- Featured Activities --&gt;&lt;i class="fa fa-grav fa-2x"&gt;&lt;/i&gt;&lt;/a&gt;&lt;/li&gt;
      &lt;li&gt;&lt;a href="#locations" data-toggle="tab" class="text-center"&gt;&lt;!-- Locations --&gt;&lt;i class="fa fa-map fa-2x" aria-hidden="true"&gt;&lt;/i&gt;&lt;/a&gt;&lt;/li&gt;
    &lt;/ul&gt;
    &lt;div id="r-s-tab" class="tab-content"&gt;
      &lt;div class="tab-pane fade active in" id="activity"&gt;    
        &lt;div class="col-lg-12"&gt;
          &lt;a href="#"&gt;&lt;img src="http://placehold.it/350x150" class="img-responsive img-rounded"&gt;&lt;/a&gt;
          &lt;a href="#"&gt;&lt;img src="http://placehold.it/350x150" class="img-responsive img-rounded"&gt;&lt;/a&gt;
          &lt;a href="#"&gt;&lt;img src="http://placehold.it/350x150" class="img-responsive img-rounded"&gt;&lt;/a&gt;
          &lt;a href="#"&gt;&lt;img src="http://placehold.it/350x150" class="img-responsive img-rounded"&gt;&lt;/a&gt;
          &lt;a href="#"&gt;&lt;img src="http://placehold.it/350x150" class="img-responsive img-rounded"&gt;&lt;/a&gt;
          &lt;a href="#"&gt;&lt;img src="http://placehold.it/350x150" class="img-responsive img-rounded"&gt;&lt;/a&gt;
          &lt;a href="#"&gt;&lt;img src="http://placehold.it/350x150" class="img-responsive img-rounded"&gt;&lt;/a&gt;
          &lt;a href="#"&gt;&lt;img src="http://placehold.it/350x150" class="img-responsive img-rounded"&gt;&lt;/a&gt;
          &lt;a href="#"&gt;&lt;img src="http://placehold.it/350x150" class="img-responsive img-rounded"&gt;&lt;/a&gt;
          &lt;a href="#"&gt;&lt;img src="http://placehold.it/350x150" class="img-responsive img-rounded"&gt;&lt;/a&gt;
        &lt;/div&gt;
      &lt;/div&gt;
      
      &lt;div class="tab-pane fade" id="locations"&gt;     
        &lt;div class="col-lg-12"&gt;
          &lt;a href="#"&gt;&lt;img src="{{ asset('img/locations/banglaore_2.png')}}" class="img-responsive img-rounded"&gt;&lt;/a&gt;
        &lt;/div&gt;
        &lt;div class="col-lg-12"&gt;
          &lt;a href="#"&gt;&lt;img src="{{ asset('img/locations/delhi_2.png')}}" class="img-responsive img-rounded"&gt;&lt;/a&gt;
        &lt;/div&gt;
        &lt;div class="col-lg-12"&gt;
          &lt;a href="#"&gt;&lt;img src="{{ asset('img/locations/goa_2.png')}}" class="img-responsive img-rounded"&gt;&lt;/a&gt;
        &lt;/div&gt;
        &lt;div class="col-lg-12"&gt;
          &lt;a href="#"&gt;&lt;img src="{{ asset('img/locations/himachal_2.jpg')}}" class="img-responsive img-rounded"&gt;&lt;/a&gt;
        &lt;/div&gt;
        &lt;div class="col-lg-12"&gt;
          &lt;a href="#"&gt;&lt;img src="{{ asset('img/locations/mumbai_2.png')}}" class="img-responsive img-rounded"&gt;&lt;/a&gt;
        &lt;/div&gt;
        &lt;div class="col-lg-12"&gt;
          &lt;a href="#"&gt;&lt;img src="{{ asset('img/locations/rishikesh_2.png')}}" class="img-responsive img-rounded"&gt;&lt;/a&gt;
        &lt;/div&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>