在onscroll上更改不同区域的div不透明度

Question

我想实现如下图所示：

我无法使用此代码进行此操作。 https://jsfiddle.net/3vy66a7o/

$(window).on('scroll', function() {
  $('.object').each(function() {
   var offset = $(this).offset().top;
   var height = $(this).outerHeight();
   offset = offset + height / 2;

   if (offset < 100) {
     $(this).fadeTo("fast", 0);
   } else if ((offset > 200) && (offset < 300)) {
     $(this).css("opacity": "1");
   } else if (offset > 300) {
     $(this).fadeTo('fast', 1);
   }
 else {
   $(this).css("opacity": "0");
 }
 });
});

Answer 1

检测窗口上的元素位置并采取相应措施。

var offset = $(this).offset().top - $(window).scrollTop();

请参阅https://jsfiddle.net/3vy66a7o/3/

这是你想要的效果吗？