Add A Loading Image to Website

我正在使用Wordpress制作一个网站。在定制器中，我添加了“加载器”样式和js代码。另外我在_header.php文件中添加一个标签。但网页始终停留在加载图像中。问题是什么？Add A Loading Image to Website

CSS：

#loader { 
position: fixed; 
left: 0px; 
top: 0px; 
width: 100%; 
height: 100%; 
z-index: 9999; 
background: url('http://i.imgur.com/36zxp64.jpg?1') 50% 50% no-repeat rgb(249,249,249); 
}

JS：

<script type="text/javascript"> 
jQuery(window).load(function() { 
jQuery("#loader").fadeOut("slow"); 
}); 
</script>

来源

2014-07-11 roth514

首先，问问自己：“我真的需要装载机吗？”如果您的网站足够慢需要，请修复此问题。特别是如果你使用这个巨人，将近1MB图像作为加载器... – ceejayoz

忘记图像，使用CSS3。 http://codepen.io/TheDutchCoder/pen/hzDqw – rcorrie

查看[JavaScript错误控制台]（http://www.creativebloq.com/javascript/javascript-debugging-beginners-3122820）并告诉你在那里看到了哪些错误以及他们指向哪条线。如果你真的有这些引号（“”），他们会抛出一个错误（你需要使用直引号（“”））。 – JJJ

使用 '负荷' 事件相反的，使用 '文件准备好' 事件。我编辑了一个新的工作jsfiddle。您可以通过更改该值来指定更长或更快的淡入淡出效果，以毫秒为单位。

//Jquery on page Ready event 
$(function(){ 
    $("#loader").fadeOut(1000); 
});

Working jsfiddle

“传递给。就绪（）处理程序保证后DOM准备好执行，因此，这通常是连接的所有其他事件处理程序和运行其它jQuery代码的最佳场所“。 [取自Jquery Document Ready页面]（http://api.jquery.com/ready/）

来源

2014-07-11 18:59:42 IndieRok

感谢您的答复。它在本地和您的jsfiddle工作。但它不工作在我的网站...似乎该网站不加载jquery，所以页面始终停留在加载图像...我不知道为什么... – roth514

您是否在浏览器Web Dev控制台中看到任何错误？ jquery加载？也许另一个脚本文件与jquery发生冲突。 – IndieRok

哦，并确保你加载jquery之前你的自定义脚本，否则将不会执行任何操作。只是说 – IndieRok

Add A Loading Image to Website

回答

相关问题