bootstrap3のtabでjscrollpane.jsを使う

Yukimi Sato 654views 更新:2014年6月16日
$('.nav-tabs li a').click(function (e) {
    e.preventDefault();
    $(this).tab('show');
    $('.tab-content > .tab-pane.active').jScrollPane();
});
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="//netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>

jquery1.11、bootstrap3.1にて動作確認済。
.tab-paneに.activeが付与された状態を指定することで、
どのタブでも別のスクロールバーを表示することができます。
スクロールもそれぞれタブを切り替えても初期位置には戻りません。

 

ログイン / 新規登録してコメントする

このソースコードをストックして後で利用したり、作業に利用したソースコードをまとめることができます。

こちらもお役に立つかもしれません