jquery - 我无法让 JQuery 滚动功能在我的网站上运行

Question

我正在尝试一种很像上面看到的效果 https://codepen.io/michaeldoyle/pen/Bhsif?editors=0010问题是，出于某种原因，它在我的电脑上根本不起作用网站http://pmoore17.altervista.org/TWADrama/index.php我正在尝试让幻灯片在内容阶段逐步停止中，反之亦然。帮忙？

我的 JQuery:

    var hidetop = $("#hidetop");
    var range = $("#hidetop").height();
    var body = $("#wrapper");

    $(window).on('scroll', function() {

      var scrollTop = $(this).scrollTop();
      var offset = hidetop.offset().top;
      var height = hidetop.outerHeight();
      offset = offset + height / 2;
      var calc = 1 - (scrollTop - offset + range) / range;

      hidetop.css({
        'opacity': calc
      });

      if (calc > '1') {
        hidetop.css({
          'opacity': 1
        });
      } else if (calc < '0') {
        hidetop.css({
          'opacity': 0
        });
      }

    });

我的 JQuery 目前已从我的网站上删除，因为它只是增加加载时间并导致图像无法加载。

Answer 1

好的，我知道了。

去掉offset = offset + height/2;中除以2的部分。

像这样:offset = offset + height;

另外，用更长的页面来测试它。
或者 - 只是为了测试 - 添加这个:

$("#wrapper").css({"height":2000});