以下のコードは、nanoscroller documentationに従ってdisplayの適切なCSSプロパティにpaneとsliderをトリガーできる必要があります。しかし、ブラウザーでFirebugを起動するためにF12を押すか、内部の要素を右クリックして調べるなど、ブラウザーで何らかの操作を行うまで、スクロール側にはsliderが表示されません。何が間違っている可能性がありますか？NanoScroller自体が起動しない
$(".nano").nanoScroller({
alwaysVisible: true,
scroll: "bottom"
});
すべてのコンテンツがロードされた後で、必ずNanoscrollerをトリガーしてください。例えば上記のコードをページの下部に配置するか、JQueryコードを挿入してページのコンテンツの読み込みが完了したことを確認してください。
私の問題はあなたと同じです。おそらく問題は、動的に生成されたコンテンツにnanoScroller関数を適用するためです。私の解決策は、次の行を追加することです：
$（ "。ペイン"）css（ "display"、 "block"）;$（ "。スライダ"）。css（ "display"、 "block"）;
問題が解決しました。あなたがChromeで「点検要素」機能により、ページをチェックしている場合は、スクロールバー（スライダー）を示して存在.paneクラスを見ることができる
スタイル=「表示：なし」
Iこれがあなたを助けることを願って
nanoscrollerが要素に対して正しくを初期化できない場合にこの問題が発生します。
クラスnanoを持つ要素が、親要素内にないことを確認します。親要素は、display:none CSSプロパティで非表示になっています。コンテンツはを表示されない場合は別のケースで
、あなたは適切な高さはクラスnanoを有する素子用設定されていることを確認したいと思います。
鉱山のように、nanoScrollerは最初に画像の幅/高さを正しく認識する必要があります。私はそれを固定する方法
：
代わりの関数を呼び出す、と/ .readyハンドラのない、
$(".nano").nanoScroller({
alwaysVisible: true,
scroll: "bottom"
});
は.LOADハンドラを試してみてください。 JQueryは、画像の幅/高さが分かっている場合にのみnanoScrollerをロードします。あなたは、引数でnanoScroller()を呼び出した場合、少なくともバージョンv0.7.4にプラグインの初期化が失敗する可能性のように見えます
$(window).load(function() {
$(".nano").nanoScroller({
alwaysVisible: true,
scroll: "bottom"
});
});
コード（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();
}
何よりも動的なコンテンツがあります。
$('#yourDiv').animate()を使用している場合は、アニメーションの終了時にnanoScroller()への呼び出しが行われていることを確認してください。 $.getJSON()を使用している場合も同じですが、コンテンツを正しく取得した後に行います。 animate()とgetJSON()の両方を使用している場合は、両方のイベントの後にnanoScroller()を呼び出します。どのプロセスが最初に終了するかがわからず、nanoScroller()へのいくつかの呼び出しが何かを損なうことはありません。
ここでは、引数がない場合は最初にnanoScroller()を呼び出し、引数が必要な場合は直ちに呼び出します。
$('.nano').nanoScroller();
$('.nano').nanoScroller({ alwaysVisible: true, scroll: 'top' });
コンテンツを動的に読み込む場合は、コンテンツが読み込まれた後でnanoScrollerを初期化する必要があります。
nanoScrollerの初期化をこのようにsetTimeoutに囲みます。
setTimeout(function(){
$('.nano').nanoScroller({ flashDelay: 1000 });
}, 0);
私は同じ問題を抱えていましたが、これは私のために解決しました。
+1「コンテンツを動的にロードする場合は、コンテンツがロードされた後にnanoScrollerを初期化する必要があります。 – Thamaraiselvam
このソリューションは、コンテンツのサイズが変更された場合でも、すべてのケースで魅力的なように機能します。これを試してみてください：
$('your div id here').mouseover(function(){
$('.nano').nanoScroller();
});
これは信じられないほどランダムなようですが、私はこの回避策を使用して問題を解決しました。ほんとありがと！ – PugsOverDrugs
あなたは素晴らしいバディです。 – Thamaraiselvam