Javascript 使用HTML CSS的预加载屏幕&；JQuery不工作

使用HTML CSS和JQuery的预加载程序屏幕不工作 我想在我的网站上添加一个预加载程序。 当重新加载页面时，它应该首先显示预加载程序，然后显示我的页面。 但它不会停止向我显示预加载图标。 我使用了人们的指南，对他们来说它可以正常工作，但不知道为什么对我来说它不能正常工作 我已附上我的完整代码

#预加载程序{
位置：固定；
z指数：999999；
背景：黑色；
宽度：100%；
身高：100%；
证明内容：中心；
}
#装载机{
显示：块；
位置：相对位置；
左：50%；
最高：50%；
宽度：150px；
高度：150像素；
利润率：-75px 0-75px；
边界半径：50%；
边框：3倍纯色透明；
边框顶部颜色：#A0816C；
-webkit动画：旋转2s线性无限；
动画：旋转2s线性无限；
}
#加载器：之前{
内容：“；
位置：绝对位置；
顶部：5px；
左：5px；
右：5px；
底部：5px；
边界半径：50%；
边框：3倍纯色透明；
边框顶部颜色：#A0816C；
-webkit动画：旋转3s线性无限；
动画：旋转3s线性无限；
}
#加载器：之后{
内容：“；
位置：绝对位置；
顶部：15px；
左：15px；
右：15px；
底部：15px；
边界半径：50%；
边框：3倍纯色透明；
边框顶部颜色：#A0816C；
-webkit动画：旋转1.5s线性无限；
动画：旋转1.5s线性无限；
}
@-webkit关键帧旋转{
0%   {
-webkit变换：旋转（0度）；
-ms变换：旋转（0度）；
变换：旋转（0度）；
}
100% {
-webkit变换：旋转（360度）；
-ms变换：旋转（360度）；
变换：旋转（360度）；
}
}
@关键帧旋转{
0%   {
-webkit变换：旋转（0度）；
-ms变换：旋转（0度）；
变换：旋转（0度）；
}
100% {
-webkit变换：旋转（360度）；
-ms变换：旋转（360度）；
变换：旋转（360度）；
}
}

黑面包店
莫尔
$（窗口）.on（“加载”，函数（）{
$（“.preload”）.fadeOut（1000）；
});

在JQuery中

    <script>
        $(window).on("load",function(){
          $(".preloader").fadeOut(1000);
        });
    </script>

---

$（“.preload”）

错误。。。您需要获得id:

$（“#preload”）

Hi@MorBiton，打开浏览器的开发工具并在控制台中检查是否存在错误通常很有用-这一个可能已经被发现-这样的错误很容易犯！

    <script>
        $(window).on("load",function(){
          $("#preloader").fadeOut(1000);
        });
    </script>