问题：
既需要“显示、隐藏”’效果，也需要动画效果。此时使用了xxx.style.display = "none / block" 之后，我们发现 transition 动画效果就没有了。
解决办法一：用定时器（这种方法并不好）
btn2.onclick = function(){
xxx.style.display = "block";
setTimeout(function(){
xxx.style.opacity="1";
},0);
};
解决办法二：用 visibility 属性代替 display
style 属性的 display 被隐藏的控件不再占用显示时占用的位置
btn2.onclick = function(){ let t = document.documentElement.scrollTop; if(t>1){ side.style.visibility="visible";//可见 side.style.opacity = "1"; }; if(t<=1){ side.style.opacity = "0"; side.style.visibility="hidden";//不可见 } };
原文：https://www.cnblogs.com/MrZhujl/p/10355649.html