3

私は jScrollPane を使用しており、スクロール量を取得する方法を見つけようとしています。基本的に、ユーザーがスクロールの一番下に到達したことを知りたいので、別の機能を起動できます。これは私の機能です：

in_page_scroll : function() {
    "use strict";
    var inpage_container = $('.pal_inpage_wrapper'),
        inpage_top_padd = $('.header_wrapper').height(),
        win_main_height = $(window).height() - inpage_top_padd;
        inpage_container.css({
            height: win_main_height,
            marginTop: inpage_top_padd,
            paddingTop: 0}).jScrollPane({
                autoReinitialise: true,
                enableKeyboardNavigation : true
            }).bind('mousewheel', function(e) {
                e.preventDefault();
            });
}

前もって感謝します。

- * 編集 * - - - - - - - - - - - - - - - - - - - - - - - --------------------------------------

私はちょうど答えを見つけました。ここにあります： 

$(function() {
    var element = $('.scroll-pane').jScrollPane(),
        api = element.data('jsp');

    $('.scroll-pane').bind('scroll', function() {
        if($('.scroll-pane').outerHeight() + api.getContentPositionY() >= api.getContentHeight()) {
            //Fire another function here
        }
    });             
});
4

1 に答える 1

2

おすすめとスタイリッシュな仕上げのために、私はこれを使用します：

JS

    $('#jScrollPane').bind(
        'jsp-scroll-y',
        関数 (イベント、scrollPositionY、isAtTop、isAtBottom)
        {   
            if(scrollPositionY > 0) {
                $(this).addClass('ShadowTOP')
            }
            if(isAtTop) {
                $(this).removeClass('ShadowTOP')
            }
        }
    .jScrollPane()

トランジション効果を追加しました。効果はGMailに似ています。

スタイル

    .トランジションシャドウ{
        トランジション: すべて 0.35 秒のイーズインアウト。
        -webkit-transition: すべて 0.35 秒のイーズインアウト。
        -moz-transition: すべて 0.35 秒のイーズインアウト。
    }
    .ShadowTOP{
       -webkit-box-shadow: inset 0px 12px 16px -10px rgba(100, 100, 100, 0.3);
        box-shadow: inset 0px 10px 16px -10px rgba(100, 100, 100, 0.3);
    }
于 2013-03-11T14:48:56.620 に答える