0

I have tried elvismdev's code http://stackoverflow.com/a/26643506/2209086 and its work like charm, same code am trying to modify but scrollbar still overlap.

In my structure there is panel under tab pane, and table responsive div under panel, I want to apply scrollbar to table-responsive class

My html is : http://stackoverflow.com/a/26643506/2209086

same structure for each tab with different table ID my js code is :

$('body').on('click', '[data-toggle="tab"]', function() {
   $(".tab-pane .panel .table-responsive").getNiceScroll().hide();
   $($(this).attr('href')).find(".tab-pane .panel .table-responsive").niceScroll({
      cursorcolor: "#2f6098",
      cursorwidth: 10,
      cursoropacitymin: 0.7,
      autohidemode: "false"
   });
   $($(this).attr('href')).find(".tab-pane .panel .table-responsive").getNiceScroll().show();
})

For first tab its working but for others its not working properly, when I inspect all scrolls are created by plugin but not showing proper tab scroll, if I resize window after tab click its work like charm.

Please help me where am going wrong.

ɢʀᴜɴᴛ
  • 32,025
  • 15
  • 116
  • 110
Ar123
  • 73
  • 6

1 Answers1

1

Use this Script......

<script>
    $('.bgs').niceScroll({
        background: '#bbb',
        cursorborder: '0',
        cursorwidth: '4px',
        horizrailenabled: false
     });

     $('.bgs').mouseover(function() {
         $('.bgs').getNiceScroll().resize();
     });
</script>
coudy.one
  • 1,382
  • 12
  • 24
Bighnesh
  • 11
  • 1