如何在Squarespace这样的网页上制作预加载器

Question

最近我一直在考虑开发一个新的网站布局，但是我最近遇到了很多灵感，但没有找到如何将它们应用到我的项目中。其中一个问题包括在允许网页加载之前预加载图像，就像Squarespace如何使用预先加载的徽标图像向网站展示然后快速过渡到其网页一样。我试着查看他们的源代码，但没有找到他们是如何做到这一点或他们使用了什么（Jquery？/ Javascript？）。我不知道。我做了一些研究，但其中大部分是由进步条和＃34;我不想要的，我只想模拟Squarespace的图像和漂亮的背景，然后转换到我的网页。有人愿意证明如何这样做吗？谢谢大家。

P.S我还在学习JavaScript和Jquery，但我对人们如何提出这些实现感到很着迷。

以下网站链接可让您更轻松：http://www.squarespace.com/ 你可以在整个网站加载之前看到一个标志加载，这是我的问题所围绕的。

Answer 1

想试试这个吗？

教程网站http://jquerybyexample.blogspot.com/2012/06/show-loading-image-while-page-is.html

HTML

<div id="dvLoading"></div>

CSS

#dvLoading{
   background:#000 url(images/loader.gif) no-repeat center center;
   height: 100px;
   width: 100px;
   position: fixed;
   z-index: 1000;
   left: 50%;
   top: 50%;
   margin: -25px 0 0 -25px;
}

JS

<script>
    $(window).load(function(){
       $('#dvLoading').fadeOut(2000);
    });
</script>