保持js值在CSS动画上

Question

我在div上使用CSS动画来显示或消失此元素。

这是我的CSS动画：

@keyframes fadeInDown {
  from {
    opacity: 0;
    transform: translate(0px, 0px);
  }

  to {
    opacity: 1;
    transform: translate(0px, calc(20vh + 87.5px));
  }
}

@keyframes fadeOut {
  from {
    opacity: 1;
    transform: translate3d(0px, calc(20vh + 87.5px), 0);
  }

  to {
    opacity: 0;
    transform: translate3d(0px, calc(20vh + 87.5px), 0);
  }
}

问题是在我的css文件中，我的div高度固定为350px； 当我在div文件上使用setAttribute为我的div文件添加fadesInDown动画时，我以不同的高度显示它，但是问题是当我放置渐变动画时，它不会保持更改的高度，而是保持固定的高度css文件（350像素）。那么如何保持更改后的高度？

这是代码js：

check_existing_file_or_error_server(0, str_samefile); //i add the animation with the set attribute
document.querySelector(".error").style.height = 350 + ((samefile_check - 1) * 30) + "px"; // i change the height here