9

以下のコードは、 nanoscroller のドキュメントに従って適切なcss プロパティpaneをトリガーできるはずです。ただし、F12を押してfirebugを起動するか、内部の要素を右クリックして検査するなど、ブラウザーで何らかのアクションを実行するまで、スクローラーは表示されません。何がうまくいかない可能性がありますか？sliderdisplayslider

        $(".nano").nanoScroller({
        alwaysVisible: true,
        scroll: "bottom"    
    });
4

8 に答える 8

3

私の場合のように、nanoScroller が適切に機能するためには、最初に画像の幅/高さを知る必要があります。

修正方法：

関数を呼び出す代わりに、.ready ハンドラーの有無にかかわらず、

$(".nano").nanoScroller({
    alwaysVisible: true,
    scroll: "bottom"     
});

.load ハンドラを試してください。現在、JQuery は、画像の幅/高さがわかっている場合にのみ nanoScroller をロードします。

$(window).load(function () {
    $(".nano").nanoScroller({
        alwaysVisible: true,
        scroll: "bottom"     
    });
});
于 2013-07-01T12:24:25.587 に答える
3

この問題は、nanoscroller が要素に対して適切に初期化できない場合に発生します。

display:noneクラス nano を持つ要素が、 CSS プロパティで非表示になっている親要素内にないことを確認してください。

別のケースで、コンテンツが表示されない場合は、クラス nano を持つ要素に適切な高さが設定されていることを確認する必要があります。

于 2013-02-12T04:54:25.330 に答える
1

私の問題はあなたの問題と同じです。動的に生成されたコンテンツに nanoScroller 関数を適用したため、問題が発生した可能性があります。私の解決策は、次の行を追加することです。

$(".pane").css("display","block"); $(".slider").css("表示","ブロック");

そして問題はなくなりました！Chrome の「Inspect Element」機能でページを確認すると、スクローラー（スライダー）が存在する .pane クラスがそれを示していることがわかります。

スタイル="表示:なし"

これがお役に立てば幸いです。

于 2013-01-08T18:58:59.973 に答える
1

すべてのコンテンツがロードされた後、必ず Nanoscroller をトリガーしてください。たとえば、上記のコードをページの下部に配置するか、JQuery コードを挿入して、ページがコンテンツの読み込みを完了したことを確認してください。

于 2012-09-19T09:13:49.533 に答える
0

コードを修正してください (jquery.nanoscroller.js)

if ((content.scrollHeight === content.clientHeight) || (this.pane.outerHeight(true) >= content.scrollHeight && contentStyleOverflowY !== SCROLL)) {
    this.pane.hide();
    /*this.isActive = false;*/
} else if (this.el.clientHeight === content.scrollHeight && contentStyleOverflowY === SCROLL) {
    this.slider.hide();
} else {
    this.slider.show();
}
于 2013-10-16T13:19:58.480 に答える