function unhide(el, dur = 300, display = "block") {
el.style.display = display;
el.style.transitionDuration = dur + "ms";
el.style.opacity = 1;
}
由于某种原因,这在Chrome中无法正常工作。
我记得曾经遇到过这样的问题,因为浏览器没有原子地应用由Javascript编写的CSS。
所以,我尝试在显示更改后放置一个断点:
function unhide(el, dur = 300, display = "block") {
el.style.display = display;
● el.style.transitionDuration = dur + "ms";
el.style.opacity = 1;
}
这样就解决了问题。
在FireFox中也会出现相同的问题,但在Microsoft Edge中不会。
我该如何解决这个问题?
有没有一种方法可以强制浏览器先应用显示,然后再应用不透明度?
我刚刚考虑使用setTimeout
(为了设置不透明度,因为显示不是原子性应用的),然而,这似乎是一种混乱/低效的 hack。