javascript - 每次单击任何内容时,我的预加载器动画都会出现

标签 javascript jquery animation preloader

每次单击任何内容时,我的预加载器动画都会出现。我希望它在进入网站时出现一次或只出现在主页上。

<div class="loader"><div style="width=150%; height=150%; background-color:white;" id="bodymovin"></div> </div>

我使用 jquery 来延迟加载时间以正确显示动画

<script type="text/javascript">
         setTimeout(function(){
        $('body').addClass('loaded');
                     $(".loader").fadeOut("slow");
    }, 5000);
</script>

我只想在进入网站或主页时在每个 session 中显示一次。我需要这方面的帮助。谢谢。

最佳答案

使用 document.referrerdocument.domain 来发现第一个条目或没有并为加载器添加 style="display:none;"

<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>

像这样:

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

  }

关于javascript - 每次单击任何内容时,我的预加载器动画都会出现,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46749598/

相关文章:

javascript - 从静态图像 URL 中提取 Flickr 照片 ID

android - 禁用特定项目的 RecyclerView itemAnimator

css - 规模 :before when hovering

c# - 如何在启动画面中应用 Lottie 动画?

javascript - 如何将 graphviz 生成的 SVG 元素关联到 DOT 源代码中的元素

javascript - 如何使用 oracle jet 在 ojTable 中显示内部对象的值

javascript - 在图标上动态添加 UI Bootstrap Popover?

javascript - 如何将单选按钮组重置为特定值

javascript - jQuery 或 AngularJS Ajax "POST"使用下面的代码向服务器请求,但不向服务器发送参数数据。

javascript - 使 textarea 文本加粗的按钮