如果元素不在窗口視圖中滾動

Question

我有一個表格，您可以選擇一個元素，然後當您按下向上或向下箭頭鍵時，將選擇下一個或上一個表格行。

爲此，我創建了以下的jQuery：

$(document).keydown(function(e) { 
    var ar=new Array(33,34,35,36,37,39); 
    if(selected_row_id != null){ 
     var key = e.which; 
     // up 
     if(key == 38){ 
      $('#'+selected_row_id).prev().trigger('click'); 
      e.preventDefault(); 
     } 
     //down 
     if(key == 40){ 
      $('#'+selected_row_id).next().trigger('click'); 
      e.preventDefault(); 
     } 

     if($.inArray(key,ar) > -1) { 
      e.preventDefault(); 
      return false; 
     } 
     return true; 
    } 
}); 

這工作得很好但是它有一個錯誤，這讓我很煩。當表格行比實際在屏幕上看到的更遠（意味着您將不得不滾動）時，窗口不會自動滾動。

我的問題是如何確保窗口在元素在屏幕上不可見時滾動？

Answer 1

這裏是here拍攝功能：

function isScrolledIntoView(elem) 
{ 
    var docViewTop = $(window).scrollTop(); 
    var docViewBottom = docViewTop + $(window).height(); 

    var elemTop = $(elem).offset().top; 
    var elemBottom = elemTop + $(elem).height(); 

    return ((elemBottom >= docViewTop) && (elemTop <= docViewBottom) 
     && (elemBottom <= docViewBottom) && (elemTop >= docViewTop)); 
} 

返回true如果該元素是完全可見的窗口，false否則。如果返回false，則可以適當地滾動窗口。

Answer 2

是的，這是可能的。

看ScrollTo：http://www.w3schools.com/jsref/met_win_scrollto.asp