如何隱藏文本時，整個頁面加載

我有一個頁面，顯示加載，我的問題是，當我向下滾動文本是存在的，我需要幫助..如何隱藏文本時，整個頁面加載

<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%); 
}

來源

2014-12-03 richie

你需要給我們更多的繼續。你的load_screen元素是怎樣的？你能設置一個JsFiddle模仿這個問題嗎？ – Pochen 2014-12-03 13:39:06

需要查看load_screen的樣式。 – dfsq 2014-12-03 13:42:08

一個黑色的屏幕和一個GIF，在中心加載，但當我向下滾動段落文本是有和加載後的段落顯示，我的問題是我想加載@Pochen隱藏段落文本 – richie 2014-12-03 13:42:42

您可以在頁面加載時顯示文本或動態地將其添加到頁面中。這兩個都是一個簡單的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 
});

來源

2014-12-03 13:45:53

謝謝@Mark Walters，其工作 – richie 2014-12-03 14:18:05

@richie Please accept and upvote this answer to show that it useful，it may help help others。謝謝 – 2015-09-10 11:55:22

如何隱藏文本時，整個頁面加載

回答

相關問題