3

jqueryUI タブを使用しており、各タブ内にスムーズなスクロール バーを実装したいと考えています。jQuery カスタム コンテンツ スクローラー、TinyScrollbar、現在は areaaperta NiceScroll などのスクロール可能なプラグインをいくつか試しましたが、スタックするたびに同じ問題が発生します - スクロールバーは 1 つのタブ内でしか機能しません。

    <script>
    $(function() {
        $( "#tabs" ).tabs();
    });
    </script>

    <div id="tabs" style="width:900px; font-size:100%;">
    <ul>
        <li><a href="#tabs-1" >FIRST</a></li>
        <li><a href="#tabs-2">SECOND</a></li>
        <li><a href="#tabs-3">THIRD</a></li>
    </ul>
    <div id="tabs-1">
        <div id="thisdiv">
        <p><b>FIRST SCROLLABLE PARAGRAPH</b>...</p></div></div>

    <div id="tabs-2"><div id="thisdiv2">
        <p><b>SECOND SCROLLABLE PARAGRAPH</b>...</p>
    </div></div>
    <div id="tabs-3">
        <p>THIRD TAB </p>
    </div>
</div>

    <script>
    $(document).ready(
  function() {     
    $("#thisdiv").niceScroll({cursorcolor:"#00F"});
    $("#thisdiv2").niceScroll({cursorcolor:"#00F"});  }
);
    </script>

UItab と niceScroll プラグインの 2 つのスクロールバーの間に競合がないことを示す jsfiddle は次のとおりです: http://jsfiddle.net/Fluc/EhcqX/4/

そして、ここでは、各タブ内のスクロールバーで同じdivを使用しようとしました: http://jsfiddle.net/Fluc/cJPT3/2/

ご覧のとおり、スクロール可能は最初のタブ内でのみ機能します..他のスクロール可能プラグと同じ..

私はjqueryプログラマーではありませんが、問題は表示プロパティに関連しているように感じます。

どんな助けでも大歓迎です!

4

0 に答える 0