javascript - 向下然后向上滚动时如何为元素设置动画

Question

我在动画方面遇到了问题，当你开始向下滚动图片时，直到 offset().top = 960px，但是当你向上滚动时，这张图片必须跟着你到顶部 - 这就是一个问题我不知道如何将其返回到顶部。这是我的网站，这个动画位于顶部

//scroll cicada
    var x = true;
    $(window).scroll(function() {
        var item = $("#cicada").offset().top;
        var place = $("#circles").offset().top;
        if (item >= 950 && x) {
            $("#cicada").css("position", "absolute");
            $("#cicada").css("top", "950px");
            x = false;
        } else if (item <= 950 && !x) {
            $("#cicada").css("top", "160px");
            x = true;
        }
    });

CSS:

.cicada {
        width: 340px;
        height: 380px;
        background: url("../includes/images/main-item-min.png") no-repeat center center;
        background-size: contain;
        position: fixed;
        z-index: 5;
        top: 160px;
        right: 59%;
        z-index: 8888;
    }

Answer 1

我想，只有当您位于滚动顶部时，即当 currentTop 为 0 时，您才应该使 header 可见。

var currentTop = $(window).scrollTop();
   if (currentTop == 0) {
      $("header").css("display", "block");
   } else {
      $("header").css("display", "none");
      if ($('.menu').hasClass("change")) {
        $('.menu').removeClass("change");
      }
   }

希望对您有所帮助。