调整窗口大小时重新计算偏移值

Question

我正在创建一个连续循环的图像页面。从 div #loop-end 到 #loop-start 双向循环，带有 jquery 滚动和偏移顶部。

https://codepen.io/akmalmo/pen/eYgoQKd

var element_position = $('#loop-start').offset().top;

$(document).on('scroll', function() {
    var y_scroll_pos = window.pageYOffset;
    var scroll_pos_test = element_position;

    if(y_scroll_pos > scroll_pos_test + 2) {


 var loopend = $('#loop-end').offset().top;
 var loopstart = $('#loop-start').offset().top;

$(document).scroll(function() {
    if ( $(document).scrollTop() >= loopend + 1 ) {
    $(document).scrollTop($('#loop-start').offset().top)
    }
  else if ( $(document).scrollTop() <= loopstart - 1 ) {
    $(document).scrollTop($('#loop-end').offset().top)
    }
    
});
         }
});

问题是这个函数在调整窗口大小时会中断，我想知道是否有一种简单的方法来重新计算偏移值？或者最好让它以更灵敏的方式计算偏移量？

Answer 1

您可以在每次调整窗口大小时使用jQuery resize event 重新计算循环变量。

$(window).resize(function() {
  // your function
});