javascript - 淡出预载器

完成加载后，如何使预加载器淡出？我尝试添加transition: 1s ease;，但我想我忘记了一些东西。

HTML：

<div class="preloader">
        <div class="preloder-wrap">
        <div><p class="typewriter" style="font-size:12px;color:#000;position:absolute;top:5px;left:1%;">function onReady(callback) {</p><p class="typewriter2" style="font-size:12px;color:#000;position:absolute;top:25px;left:1%;">var intervalID = window.setInterval(checkReady, 1000);</p><p class="typewriter3" style="font-size:12px;color:#000;position:absolute;top:45px;left:1%;">}</p><p class="typewriter4" style="font-size:12px;color:#000;position:absolute;top:75px;left:1%;">function checkReady() {</p><p class="typewriter5" style="font-size:12px;color:#000;position:absolute;top:95px;left:1%;">if (document.getElementsByTagName('body')[0] !== undefined) {</p><p class="typewriter6" style="font-size:12px;color:#000;position:absolute;top:115px;left:1%;">window.clearInterval(intervalID);</p><p class="typewriter7" style="font-size:12px;color:#000;position:absolute;top:135px;left:1%;">}</p></div>
            <div class="preloder-inner">
            <br><br>
            <div class="box loading"></div>
                <br><br><div id="fadeinvtx" style="color:#FFF; text-align:center;"><i>//loading%</i></div>
            </div>
        </div>
    </div>

CSS：

.preloader{
    position: fixed;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    display: table;
    background: #000;
    z-index: 9999;
}

.preloder-wrap{
    display: table-cell;
    vertical-align: middle;
}

.preloder-inner {
    width: 200px;
    height: 100px;
    margin: 0 auto;
}

谢谢。

最佳答案

在您的javascript中，加载完成后，可以使用jquery的fadeOut函数：

$("preloader").fadeOut();

关于javascript - 淡出预载器，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/44010163/