javascript - 调整大小需要刷新

Question

所以我想做的是我有 3 个 div 每个 div 应该滚动到另一个 div 并且当它到达顶部时它的位置应该是固定的。

所以一切正常，直到我们调整窗口大小(它需要刷新页面)。 如何解决这个问题？我的意思是我们不能在不刷新页面的情况下这样做吗？

我使用了调整大小，但它对我不起作用。而且我不确定这是否是使用调整大小的正确方法

JSFiddle我的作品的副本

var $cache = $('#two');
var $cache2=$('#three');

var vTop = $cache.offset().top - parseFloat($cache.css('margin-top').replace(/auto/, 0));
var vTop2 = $cache2.offset().top - parseFloat($cache2.css('margin-top').replace(/auto/, 0));

$(window).scroll(function (event) {
    var vTop = $cache.offset().top - parseFloat($cache.css('margin-top').replace(/auto/, 0));
        var vTop2 = $cache2.offset().top - parseFloat($cache2.css('margin-top').replace(/auto/, 0));
 });

  $(window).scroll(function (event) {
    var y = $(this).scrollTop();
    if (y >= vTop) {     
      $cache.addClass('stuck');
      $('#one').addClass('stuck');
      $('#two h2').addClass('stuck');     
    } else if(y>=vTop2)
    {
         $('#two h2').removeClass('stuck');
    }
      else {
      $cache.removeClass('stuck');
      $('#one').removeClass('stuck');
       $('#two h2').removeClass('stuck');       
    }
  });

Answer 1

使用window.onresize来处理元素:

window.onresize = function(event) {
//handling code in between
}