2010-12-03 64 views
1

jScrollPane是一个非常棒的jQuery插件,它修改了默认的浏览器滚动条。我正在开发一个将使用jScrollPane的聊天应用程序。它迄今为止效果很好,除了我无法确定最大滚动高度的事实。这是我想要做的:如何在jScrollPane中获取最大滚动高度?

$(function() 
{ 
    $('#chatPane').jScrollPane(); 
    var api = $('#chatPane').data('jsp'); 
    setInterval(function() 
    { 
     $.ajax(
     { 
      url: "Home/GetMessage", 
      type: "POST", 
      success: function (response) 
      { 
       // This next line is where the issue occurs. I need to check if the current scroll position is equal to the max scroll position. This is to implement the auto scroll if the user has scrolled to the bottom of the chat. 
       var atBottom = (api.getContentPane().getContentPositionY() == api.getContentPane().getMaxScrollHeight()??????); 
       api.getContentPane().append(response); 
       api.reinitialise(); 
       if (atBottom) 
        api.scrollToBottom(); 
      }, 
      error: function (xhr, textStatus, errorThrown) 
      { 
       alert(textStatus); 
      } 
     }); 
    }, 1000); 
}); 

getMaxScrollHeight不存在。我需要一些方法来确定最大滚动高度。

编辑:我得到它与ajax成功函数的以下更改一起工作。但如果有人知道比滚动到底部更好的方式,获得当前位置,然后滚动回到以前的位置,将不胜感激。

  success: function (response) 
      { 
       var currentPosition = api.getContentPositionY(); 
       api.scrollToBottom(); 
       var maxPosition = api.getContentPositionY(); 
       api.scrollToY(currentPosition); 
       var atBottom = (currentPosition == maxPosition); 
       api.getContentPane().append(response); 
       api.reinitialise(); 
       if (atBottom) 
        api.scrollToBottom(); 
      } 

回答

1

一个解决方案,你可以尝试是模拟scrollToBottom(),然后用模拟之前的值进行比较所产生的getContentPositionY()。如果它没有改变,那么用户已经在底部,所以在附加响应内容后,请拨打scrollToBottom()“真实”。

要运行模拟,您可以尝试克隆原始对象,然后在内存中修改它。有关更多信息,请参阅http://api.jquery.com/clone/。例如:

var simulatedPane = $('#chatPane').clone(); 
simulatedPane.jScrollPane(); 
var simulatedApi = simulatedPane.data('jsp'); 

然后,在success()函数中,使用simulatedApi进行模拟。

+0

有趣的想法。我怎么会模拟一个scrollToBottom()虽然,有什么想法? – Chev 2010-12-03 19:35:46

+0

我可以想到两种方法:第一种方法是创建一个与页面上的实际对象具有相同属性的内存中Javascript副本,并在其上运行命令。第二种方法是存储当前的滚动位置,针对活动对象运行命令,然后恢复先前的滚动位置。这可能会导致用户界面跳转,因此您必须对其进行测试以查看它是否可用。 – ChessWhiz 2010-12-03 19:39:18

1

我看到你已经有了一个解决方案。另一种方法可能是添加一个侦听器jsp-scroll-y事件:

http://jscrollpane.kelvinluck.com/events.html

此侦听获取isAtTop和isAtBottom通过布尔值。您可以将其存储在变量中,并在重新初始化滚动窗格之前检查变量的状态。

从长期来看,这将是巨大的,如果你可以添加的功能要求一些额外的方法添加到API:isAtTopisAtBottomisAtLeftisAtRight - 如果您添加到github issues list然后我会添加它,当我得到一个机会。