document.addEventListener("click", (e) => {
      const clicklogin = document.getElementsByClassName("login")[0];
      const loginbox = document.getElementById("gotologin");
      const boxindex = e.path.findIndex((item) => item == loginbox);
      if (e.target != clicklogin && boxindex == -1) {
        document.body.removeAttribute("style");          //这行是控制隐藏之后恢复可以滑动页面
        const animatesty = document.getElementById("gotologin");
        animatesty.classList.remove("animate__zoomIn");  //把进入动画类名移除 进入动画和消失动画不能同时存在 点击显示的时候同理
        animatesty.classList.add("animate__zoomOut");   //添加消失动画
        window.setTimeout(() => {                       //设置定时器是因为消失动画有时间的 如果不设置 会出现在消失的时候立刻调整位置
          const becauseanimate = document.getElementById("becauseanimate");  //后面的代码是因为我设置了拖拽效果 所以要设置隐藏的时候把位置改成默认值
          becauseanimate.style.top = "50%";
          becauseanimate.style.left = "50%";
        }, 300);
      }
    });