JavaScript + CSS3动画无法正常工作？

Question

我目前正在编写一个名为quickly.js的库。有conceal(milliseconds)和display()函数，它们具有通过CSS编程的动画。隐藏功能动画正常工作，但显示功能动画无法正常工作。它不会消失。相反，它会突然出现。这是一个JSFiddle演示错误：https://jsfiddle.net/v6esmqtf/6/。

Answer 1

您根本没有设置display功能。

Element.prototype.conceal = function(ms) {
  ms = ms || 0;
  var thisStyle = this.style;
  thisStyle.opacity = 0;
  setTimeout(function() {
    thisStyle.display = "none";
  }, ms);
};

Element.prototype.display = function(ms) {
  ms = ms || 0;
  var thisStyle = this.style;
  thisStyle.display = "";
  setTimeout(function() {
    thisStyle.opacity = 1;
  }, ms);
};

然后......

document.getElementById("conceal").onclick = function() {
  document.getElementById("get").conceal(800);
};

document.getElementById("display").onclick = function() {
  document.getElementById("get").display(0);
};

希望这有帮助。