javascript - jScrollPane 滚动量

标签 javascript jquery jscrollpane jquery-jscrollpane

我正在使用 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
        }
    });             
});

最佳答案

只是为了推荐和时尚的完成,我用这个:

 JS

    $('#jScrollPane').bind(
        'jsp-scroll-y',
        function(event, scrollPositionY, isAtTop, isAtBottom)
        {   
            if(scrollPositionY > 0) { 
                $(this).addClass('ShadowTOP')
            }
            if(isAtTop) { 
                $(this).removeClass('ShadowTOP')
            }
        }
    ).jScrollPane()

我添加了过渡效果。效果会类似GMail。

STYLE

    .TransitionShadow{
        transition: all 0.35s ease-in-out;
        -webkit-transition: all 0.35s ease-in-out;
        -moz-transition: all 0.35s ease-in-out; 
    }
    .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);
    }

关于javascript - jScrollPane 滚动量,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10535996/

相关文章:

javascript - 点击行编辑按钮时使行可编辑

javascript - 访问数组中对象的属性

javascript - 在 Typescript 中扩展 {}(对象)

javascript - 第二次单击浅灰色弹出窗口时,Azure Media Player 不播放视频

java - 删除 JScrollPane 内的边框

java - 使用 JScrollPane 滚动文本时偶尔会出现扭曲显示

javascript - 如果 div 为空则隐藏按钮

javascript - Sweet Alert 框我添加了 4 个按钮,只有一个按钮可以工作

javascript - jQuery UI - 如何在对话框关闭后删除动态元素?

java - 组合 JTextArea