jscrollpane scrolltobottom但在滚动条上暂停鼠标悬停

时间:2013-09-30 08:55:52

标签: javascript jquery jscrollpane

我已经完成了这个代码,但我坚持最后我必须做的事情,当一个项目被添加它自动滚动到底部这是伟大的但我无法弄清楚如何做,我确定它的简单是当我使用滚动条时,我想阻止它跳到底部,直到我停止使用滚动条。

你会在我提供的示例中看到如果你单击滚动条并向上拖动它会在添加新项目时继续向下跳,我只需要暂停它直到我停止使用滚动条如果这是有道理的。

它使用api.scrollToBottom();添加新项目后滚动到底部是正确的,但不确定是否有鼠标悬停等条件......当这些是条件时停止。

希望有人可以帮助我,非常感谢! :)

JSFiddle:http://jsfiddle.net/GT7sV/2/

JS

var settings = {
        showArrows: true,
        verticalArrowPositions: 'os',
        horizontalArrowPositions: 'os',
        animateScroll: true
    };
    var pane = jQuery('.scroll-pane');
    pane.jScrollPane(settings);
    var api = pane.data('jsp');
    var i = 1;

    api.scrollToBottom();

    setInterval(
        function()
        {
            api.getContentPane().append("<li>testing this new item</li>").children(':last').hide().fadeIn(1000);
            api.reinitialise();
            api.scrollToBottom();
        },
        1000
    );

});

谢谢!

1 个答案:

答案 0 :(得分:0)

我不知道这对你是否合适,但你可以尝试不同的方向。当用户滚动到底部时,您可以加载新行:

conversationHeadersScrollPane = $('.scroll-pane').bind(
        'jsp-scroll-y',
        function(event, scrollPositionY, isAtTop, isAtBottom) {
            if (isAtBottom) {
                //add new rows for example with ajax call
            }
});

编辑:有一个函数getPercentScrolledY() 所以你可以在调用scrollToBottom之前检查用户是否例如低于90%,如果不是让他在他自己滚动到底部时阅读。