我想为我的网页使用预加载器。单击我页面上的链接后,当前的预加载器不会立即加载。可以看到现有页面,一段时间后(在加载新页面前几秒钟)预加载器工作并且新页面可见。我希望我的预加载器在我刷新或单击网页上的任何链接后立即工作。
#loading{
position: fixed;
width: 100%;
height: 100vh;
background: #fff
url('https://static-steelkiwi-dev.s3.amazonaws.com/media/filer_public/2b/3b/2b3b2d3a-437b-4e0a-99cc-d837b5177baf/7d707b62-bb0c-4828-8376-59c624b2937b.gif')
no-repeat center center;
z-index: 99999;
}
<!DOCTYPE html>
<html>
<head>
{% load static %}
<link rel="stylesheet" href="{% static '/styles1.css' %}">
</head>
<body onload="myFunction()" class="hold-transition skin-green sidebar-collapse sidebar-mini fixed">
<div id="loading"></div>
...
...
<script>
var preloader = document.getElementById("loading");
function myFunction(){
preloader.style.display = 'none';
};
</script>
</body>
</html>
相关分类