javascript - 在用户清除缓存之前，我如何让我的网站预加载器只出现一次？

Question

我的网站有一个预加载器并且运行良好。它只附在主页上，但是，每当我返回主页时，预加载器都会再次出现。我希望一旦网站(主页)已经被缓存，预加载器就不会出现。

Here is my site

这是我的 javascript:

<script type="text/javascript">
 //<![CDATA[
 $(window).load(function() { 
 $("#status").fadeOut(); 
 $("#preloader").delay(350).fadeOut("slow"); 
 })
 //]]>
 </script> 

Answer 1

我提到了这个链接: http://www.w3schools.com/js/js_cookies.asp您可以使用 javascript 函数来实现这一点

演示:

<script type="text/javascript">
function getCookie(c_name)
{
var i,x,y,ARRcookies=document.cookie.split(";");
for (i=0;i<ARRcookies.length;i++)
  {
  x=ARRcookies[i].substr(0,ARRcookies[i].indexOf("="));
  y=ARRcookies[i].substr(ARRcookies[i].indexOf("=")+1);
  x=x.replace(/^\s+|\s+$/g,"");
  if (x==c_name)
    {
    return unescape(y);
    }
  }
}

function setCookie(c_name,value,exdays)
{
var exdate=new Date();
exdate.setDate(exdate.getDate() + exdays);
var c_value=escape(value) + ((exdays==null) ? "" : "; expires="+exdate.toUTCString());
document.cookie=c_name + "=" + c_value;
}

 //<![CDATA[
 $(window).load(function() { 

if(!getCookie("loaded")){

编辑

 //Show element only if the cookie is absent.
 $("#preloader").show();
 $("#status").fadeOut(); 
 $("#preloader").delay(350).fadeOut("slow"); 
//property name , value and no of expiration days
setCookie("loaded",true,365);
    }
else{
    $("#preloader").hide();
    $("#status").hide();
}

 })
 //]]>
 </script> 

编辑:您还可以通过设置 preloader 元素的 display:none 将元素初始化为默认隐藏。然后通过 javascript 将仅在 cookie 不存在时显示该元素。查看我在代码中的编辑。