6

jScrollPaneを自分のWebサイトにインストールしましたが、動作させることができません。

私のウェブサイトは次のように機能します。メインページから、jQueryのload()メソッドを使用してページが動的に読み込まれます。ロードしたページには、jScrollPaneを起動するための次のスクリプトがあります。

$(function(){
    $('.scroll-pane').jScrollPane();
});

と呼ばれているようです。今のところ問題はないと思います。問題は、最初のページがスクロールバーを必要とするほど長くないことです。特定のアクションでのみ表示される非表示のコンテンツがあります(つまり、ボタンをクリックすると特定の段落のコンテンツが表示されます)。クリックして非表示のdivのコンテンツを表示すると、スクロールバーが表示されません。

また、新しいコンテンツを表示するときに電話をかけようとしまし$('.scroll-pane').jScrollPane();たが(つまり.show()、非表示でトリガーされた場合は、div電話もかけます$('.scroll-pane').jScrollPane();)、それでも成功しませんでした。

誰か助けてもらえますか?

ありがとう

編集:

ページの構造について言及するのを忘れました。ページの読み込みがあり、読み込まれるdivものがあり、特定の領域をクリックすると表示される小さな非表示のdivが含まれています。class="scroll-pane"表示されたdivのコンテンツをスクロール可能にするために、クラスscroll-paneを使用してスクロールバーをdivに追加したいと思います(現在、コンテンツはdivのサイズのままですが、jScrollPaneスクロールバーがないためスクロールできません示されている)。

アップデート:

$('.scroll-pane').jScrollPane();divのメソッドのコールバックを入れて、表示されたdiv.show()に入れようとしましたclass="scroll-pane"が、何も表示されません(スクロールバーが表示されず、divがスクロールできません)。

4

2 に答える 2

19

プラグインの開発者によって提供されたこのデモを確認してください

http://jscrollpane.kelvinluck.com/examples/invisibles.html

要素が最初に表示されたときに、スクロールペインを(再)初期化するだけで(または、必要に応じてautoReinitialiseを使用することもできます)、その幅と高さが正しく計算されます。

必要なのは

$(function(){
    $('.scroll-pane').jScrollPane({autoReinitialise: true});
});

プラグインの最新バージョンである可能性があります

于 2012-01-29T06:46:53.643 に答える
1

自動再初期化の代わりに css 可視性プロパティを使用することをお勧めします。show() メソッドを呼び出すたびに、jScrollPane は自身を再初期化します。これには時間がかかり、アニメーションに影響します。

たとえば、slide..() メソッドを使用すると、アニメーションは適切に開始されますが、スクロール可能なコンテナー (およびその要素) が少し遅れて表示され、見栄えが悪くなります。

var wrapper = jQuery('#gallery-album-preview-wrapper');
if (wrapper.css("visibility") == "hidden") {
    wrapper.css("visibility", "visible").css("display", "none");
}
if (wrapper.is(":hidden")) {
    wrapper.slideDown(1000);
} else {
    wrapper.slideUp(1000);
}
于 2012-10-27T08:30:43.797 に答える