如何向此 javascript 函数添加过渡

Question

我无法向此 Javascript 函数添加过渡。

function togglediv(id) {
    var div = document.getElementById(id);
    div.style.display = div.style.display == "none" ? "block" : "none";
}

Answer 1

display 属性无法设置动画。

您可以做的是通过动画opacity 淡入/淡出。添加一个css类'out'，其定义如下

.out {
    opacity: 0;
    transition: opacity 1s;
}

见https://jsfiddle.net/s42stnyw/2/