Preloader reappears after refreshing the page

Question

Preloader reappears after refreshing the page

Navigation

#1 by (1 votes)
#2 by (0 votes)

1

I'm having a problem I made this website

works as I hope but if I open it in cell chrome after refreshing the page or go to another page the preloader reappears, any ideas on how to fix it?

This is the html code :

<br> 
<body>
<div id="preloader">
    <div class="cssload-loader-inner">
        <div class="cssload-cssload-loader-line-wrap-wrap">
            <div class="cssload-loader-line-wrap"></div>
        </div>
        <div class="cssload-cssload-loader-line-wrap-wrap">
            <div class="cssload-loader-line-wrap"></div>
        </div>
        <div class="cssload-cssload-loader-line-wrap-wrap">
            <div class="cssload-loader-line-wrap"></div>
        </div>
        <div class="cssload-cssload-loader-line-wrap-wrap">
            <div class="cssload-loader-line-wrap"></div>
        </div>
        <div class="cssload-cssload-loader-line-wrap-wrap">
            <div class="cssload-loader-line-wrap"></div>
        </div>
    </div>
   </div>
</body> 
<br>

This is the css :

#preloader{
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 99999;
display: flex;
flex-flow: row nowrap;
justify-content: center;
align-items: center;
background: none repeat scroll 0 0 #000000;
}'<br>Y este el javascript relevante:<br>

$(window).on("load", function(){
$("#preloader").fadeOut("slow");    
});

javascript html css

asked by Gabriel Rodriguez 06.09.2018 в 01:29

source

2 answers

1

Look at this example

HTML

<body>
    <div id="Cargando">Cargando...</div>
....

Put it at the start of your site that is the first thing to load the page

JS

    <script>
    $(document).ready(function(){
        setTimeout(function(){
            $("#Cargando").hide();
        },100);
    });
    </script>

This you put at the end of your page, since you loaded all the HTML, CSS, etc.

and finally

CSS

<style>
#Cargando{width:100%;height:9999%;position:absolute;top:0px;padding:0px;background:white;text-align:center;z-index:9999;padding-top:20px;color:black;;}
</style>

You put this in the head of your site

I hope it works, Greetings:)

answered by 06.09.2018 в 04:32

whats app web custom field for the phone Problem in MySQL Select query

score 0 · Accepted Answer

After searching I found the solution in this post

By placing this code:

window.addEventListener ? 
window.addEventListener("load",yourFunction,false) : 
window.attachEvent && window.attachEvent("onload",yourFunction);

Then with that if it detects the load event in mobile and I add the function to it

$(".preloader").fadeOut("slow");

And there if it works when you reload the page, it works well.
Thank you all for your help.