Niloy
Niloy

Reputation: 606

My preloader animation appears every time when i click anything

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

Answers (3)

mscdeveloper
mscdeveloper

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

David Floydd
David Floydd

Reputation: 1

You could check before calling the timeout

   if(!$('body').hasClass('loaded')){
    setTimeout(function(){
            $('body').addClass('loaded');
                         $(".loader").fadeOut("slow");
        }, 5000);
   }

Upvotes: 0

aleksey-exe
aleksey-exe

Reputation: 93

I think you tell not all.

Your code has listener for click event somewhere else.

Upvotes: 0

Related Questions