Question

我有一个显示加载的页面，我的问题是当我向下滚动文本时，我需要帮助..

<h6>Hello, world!</h6>     
<div id="load_screen"> <div id="loading"> <img src="images/loading.gif"> </div> </div>

这是JS

<script> window.addEventListener("load", function(){ var load_screen = document.getElementById("load_screen"); document.body.removeChild(load_screen); }); <script>

div#load_screen{
   background: #000000;
   opacity: 1;
   z-index:10;
   position: absolute;
   margin: auto;
   left: 0; 
   right: 0;
   top: 0;
   bottom: 0;
}

div#load_screen > div#loading > img{
  position: fixed;
  top: 50%;
  left: 50%;
  /* bring your own prefixes */
  transform: translate(-50%, -50%);
}

Answer 1

您可以在页面加载时显示文本，也可以动态地将其添加到页面中。这是一个简单的jQuery。

<div id="load_screen"> <div id="loading"> <img src="images/loading.gif"> </div> </div>

然后动态添加内容

$(document).ready(function(){ 
    var title = $('<h6></h6>').html('Hello World');
    $('#load_screen').before(title);
    $('#load_screen').remove();
});

显示/隐藏

<h6 id="title" class="hidden"></h6> <!-- need to make sure you have a class of hidden in css  -->
<div id="load_screen"> <div id="loading"> <img src="images/loading.gif"> </div> </div>

CSS .hidden { display: none; visibility:hidden; }

然后jQuery将是这样的

$(document).ready(function(){
    $('#title').show();
    $('load_screen').hide();
    $('load_screen').remove(); //Or remove it
});

如何在加载整个页面时隐藏文本

1 个答案: