1

私は mCustomScrollbar を使用しており、スクロールの上下にコンテンツを動的にロードしようとしています (もちろん、同時にではありません)。

http://manos.malihu.gr/jquery-custom-content-scroller/

コンテンツを追加すると、スクロールは正しい位置に留まります (スクロールした位置に留まり、スクロールバーの位置が自動的に変更されるため、下にスクロールして新しいコンテンツを表示できます)。

ただし、コンテンツを先頭に追加 (スクロールバーの一番上に配置) し、ユーザーが上にスクロールすると、コンテンツは読み込まれますが、スクロールバーは強制的に上に移動します。一番下にコンテンツを追加するときとまったく同じように動作させたい: ユーザーが上にスクロールして新しいコンテンツを表示できるようにする。

$(selector).mCustomScrollbar({
    mouseWheel: { 
        scrollAmount: 500,
        preventDefault: true
    },
    callbacks: {
        advanced: {
            updateOnContentResize: true
        },
        onScroll: function() { 
            // this.mcs.topPct contains the current scroll position (when scroll animation is completed.
            // it can be between 0-100, where 100 is bottom and 0 is top
            //
            // my scroll starts on the bottom, and when this.mcs.topPct is 0
            // I load dynamic content and place it on the very top of all content
            // this causes the scroll to display this content immediately,
            // and I would like the user to manually scroll up to see the added content.
        }
    }
});
4

3 に答える 3

0 
$(selector).mCustomScrollbar({
mouseWheel: { 
    scrollAmount: 500,
    preventDefault: true
},
callbacks: {
    advanced: {
        updateOnContentResize: true
    },
    onBeforeUpdate:function(){
        this.totalScroll = this.mcs.topPct.slice(0);
    },
    onUpdate:function(){
        this.mcs.topPct = this.totalScroll;
    }
});

上と下の両方にオブ​​ジェクトをレンダリングするリストを実際に作成する時間がないため、機能するかどうかはわかりませんが、機能する場合は素晴らしいです!

それが機能するかどうか教えてください:)

于 2016-10-17T21:17:33.133 に答える
0

それがまだ関連している場合、私の解決策は次のとおりです。

  1. 新しいデータをロードする前に (jquery ロード/ポストを使用すると仮定)、最初の一番上のエントリ (コメント、画像など) をオブジェクト 'YourObject' として取得します (好きなように名前を付けます)

  2. 新しいコンテンツをロードしたら、次の行を使用します

    $(selector).mCustomScrollbar("scrollTo",YourObject,{scrollInertia:0});

少しちらつきますが、現時点ではそれが達成する唯一の方法です。

于 2016-08-05T15:44:06.083 に答える