javascript - 如何使用带有过渡缓进出效果的javascript隐藏/显示div？

Question

这是我隐藏/显示 div 的代码...但我想要在 javascript 中隐藏/显示时的过渡效果，如缓入出。如何在 JavaScript 中实现这一点？

function showHide(shID) {

    if (document.getElementById(shID)) {
        if (document.getElementById(shID + '-show').style.display != 'none') {
            document.getElementById(shID + '-show').style.display = 'none';
                document.getElementById(shID).style.display = 'block';
                window.scrollTo(0, 2346);
            }
        else {

            document.getElementById(shID + '-show').style.display = 'inline';
            document.getElementById(shID).style.display = 'none';

        }
    }
}

Answer 1

我不确定为什么你不使用 CSS3 过渡。

但是为了严格遵守 javascript，这个源代码可能会有所帮助: https://github.com/jquery/jquery/blob/master/src/effects.js#L107