確定是否滾動到div的底部

我有燼應用程序。其中我有導航欄中的圖標，當點擊時顯示一個帶有通知的下拉菜單。我已經將下拉的最大高度設置爲390px。現在，我想確定何時用戶已經到達了下拉菜單的底部，這樣我就可以對服務器進行ajax調用以獲取更多數據。確定是否滾動到div的底部

HTML

<div class="ps-content"> 
.....notification content..... 
</div>

CSS

.ps-container{ 
    max-height: 390px; 
    position: relative; 
}

didInsertElement: function(){ 
    $('.ps-content').on('scroll', $.proxy(this.didScroll, this)); 
    }, 
    willDestroyElement: function(){ 
    $('.ps-content').off('scroll', $.proxy(this.didScroll, this)); 
    }, 

    didScroll: function(){ 
    if (this.isScrolledToBottom()) { 
     this.sendAction('loadMore'); 
    } 
    }, 

    // we check if we are at the bottom of the page 
    isScrolledToBottom: function(){ 
     var distanceToViewportTop = WHAT SHOULD I AM DO HERE ? 
     var viewPortTop = $('.ps-content').scrollTop(); 
     if (viewPortTop === 0) { 
     return false; 
     } 
     return (viewPortTop - distanceToViewportTop === 0); 
    },

當我做$（ 'PS-內容'）高度它給390px.How得到整個內容高度渲染到下拉菜單中？

在「viewPortTop」我得到了多少用戶滾動。但我無法弄清楚我該怎麼做「distanceToViewportTop」這樣，當用戶達到底部有差異是零。我不能使用documnet高度和窗口高度，因爲它需要整個頁面高度。對於整個頁面它是documnet - 窗口高度來獲得底部頁面。我應該爲div做什麼？

來源

2016-03-29 800i

有一些屬性/方法，你可以使用：

$().scrollTop()//how much has been scrolled 
$().innerHeight()// inner height of the element 
DOMElement.scrollHeight//

高度元素

這樣的內容，你可以把前兩個屬性的總和，而當它等於給最後一個屬性，你已經達到了目的：

jQuery(function($) { 
    $('#flux').on('scroll', function() { 
     if($(this).scrollTop() + $(this).innerHeight() >= $(this) [0].scrollHeight) { 
      alert('end reached'); 
     } 
    }) 
});

http://jsfiddle.net/doktormolle/w7X9N/

來源

2016-03-29 13:24:57

確定是否滾動到div的底部

回答

相關問題