JS - scrollToEl獲取滾動位置

Question

我工作的一個網站上http://www.imbeeld.nl一些JS：

$(document).ready(function() { 
    var personPosition = 0; 

function scrollToEl(el) { 
    $('html, body, *').animate({scrollLeft: $(el).offset().left}, 1000); 
    } 

    $('#wrapper_h1').on('click', 'div.body_arrowr', function(e) { 
    e.preventDefault(); 
    var nextPerson = $('#wrapper_h1 div.body').get(personPosition + 1); 
    personPosition += 1; 
    scrollToEl(nextPerson); 
    }); 

    $('#wrapper_h1').on('click', 'div.body_arrowl', function(e) { 
    e.preventDefault(); 
    var previousPerson = $('#wrapper_h1 div.body').get(personPosition - 1); 
    personPosition -= 1; 
    scrollToEl(previousPerson); 
    }); 

$('.button, .menu_button, #back').on('click', function() { 
scrollToEl('#' + $(this).data('target')); 
}); 
}); 

兩個箭頭，左，右，導航到上和下div.body（「人」在腳本中）。 但是當通過站點手動滾動時，personPosition不會被更改。因此，滾動後單擊箭頭將導航到最後一個箭頭訪問的下一張幻燈片。

如何在用箭頭導航時包含滾動位置？

Answer 1

$(document).keydown(function(e) { 
    switch(e.which) { 
     case 37: // left 
      var nextPerson = $('#wrapper_h1 div.body').get(personPosition + 1); 
      personPosition += 1; 
      scrollToEl(nextPerson); 
      break; 

     case 39: // right 
      var previousPerson = $('#wrapper_h1 div.body').get(personPosition - 1); 
      personPosition -= 1; 
      scrollToEl(previousPerson); 
      break; 

     default: return; // exit this handler for other keys 
    } 
    e.preventDefault(); // prevent the default action (scroll/move caret) 
}); 

代碼由this answer

啓發