Reputation: 606
My preloader animation appears every time when i click anything. I want it to appear for single time when entering the website or just for home page.
<div class="loader"><div style="width=150%; height=150%; background-color:white;" id="bodymovin"></div> </div>
I used jquery to delay the loading time to show the animation properly
<script type="text/javascript">
setTimeout(function(){
$('body').addClass('loaded');
$(".loader").fadeOut("slow");
}, 5000);
</script>
I just want it to show once per session when enter into website or just for home page. I need help on this. Thank you.
Upvotes: 1
Views: 481
Reputation: 2889
use document.referrer
and document.domain
for discover first entry or no and add style="display:none;"
for loader
<div class="loader" style="display:none;">
<div style="width=150%; height=150%; background-color:white; border-style:solid;" id="bodymovin">
My text for one show...
</div>
</div>
<a href="">test link for self page(for not show loader)</a>
like this:
var referrer = document.referrer;
var domain = document.domain;
if(referrer.indexOf(domain)<0){ //if refer from curent domain.
$(".loader").show(); //show loader
setTimeout(function(){
$(".loader").fadeOut("slow");
}, 5000);
}
Upvotes: 1
Reputation: 1
You could check before calling the timeout
if(!$('body').hasClass('loaded')){
setTimeout(function(){
$('body').addClass('loaded');
$(".loader").fadeOut("slow");
}, 5000);
}
Upvotes: 0
Reputation: 93
I think you tell not all.
Your code has listener for click event somewhere else.
Upvotes: 0