2010-12-03 35 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然後我會添加它,當我得到一個機會。