如何通过悬停动态添加类来做出反应？

Question

当您在顶部滚动时，坚持类正在添加。如果你滚动很多小缩图出现在右边。所以有两个问题：

1. 为什么所有元素都不会通过添加类测试？
来对悬停做出反应
2. 如何在下一个坚持课程中添加课程测试？

The link on example.

$(window).scroll(function() {

  $('.text-layer').each(function(i) {

    $window = $(window);
    var increase = i * 50
    var newHeight = $(".text-layer").outerHeight();
    var newWidth = $(".text-layer").outerWidth();
    var distance = $(this).parent().offset().top + newHeight

    if ($window.scrollTop() >= distance) {
      $(this).addClass('sticked').css("transform", "translate(100%," + increase + "px) scale(.8)");
      $(this).parent().css({"height": newHeight, "width": newWidth });
      checkit()
    }

    if ($window.scrollTop() <= distance) {
      $(this).removeClass('sticked').css("transform", "translate(0px, 0px)");
    }
  });

});

function checkit() {
  $('.text-layer.sticked').hover(function() {
      $(this).toggleClass('test')

})
}