时间戳

首页 > 解决方案 > 如何在我的网站加载之前制作一个 gif 图标以显示在我的预加载器上

javascript - 如何在我的网站加载之前制作一个 gif 图标以显示在我的预加载器上

问题描述

我将此代码添加到我的网站，以便在我的网站加载之前显示预加载器，但我只能在我的网站加载之前显示背景颜色。

我正在尝试制作一个 gif 图标，以便在我的网站加载之前像加载图标一样显示在预加载器背景色上。

我注意到我的网站加载速度非常快，因此在我的网站加载之前只显示预加载器背景颜色。预加载器图标根本不显示。

以下是我的代码。我添加了 CSS 并将脚本添加到我的网站正文中；

//<![CDATA[
$(document.body).append('<div id="page-loader"></div>');
$(window).on("beforeunload", function() {
$('#page-loader').fadeIn(1000).delay(9000).fadeOut(1000);
});
//]]>
#page-loader{position:fixed!important;position:absolute;top:0;right:0;bottom:0;left:0;z-index:999999;background:#f99e47 url(&#39;https://4.bp.blogspot.com/-CVUATsjGPVg/YEC5gsBL18I/AAAAAAAACw8/g8ABr7RU79kjnJocwCpfQ5wgy1WR0uHRACK4BGAYYCw/s1600/latest%2Blogo.png&#39;) no-repeat 50% 50%;padding:1em 1.2em;display:none}

这是它在我的网站上加载的结果：https ://mybloggertestpage.blogspot.com/

请问，我做错了什么？谢谢。

标签： javascripthtmlcsspreloader

解决方案

我认为问题在于您在哪里给了网址正确的代码应该是这样的（据我所知）url("https://4.bp.blogspot.com/-CVUATsjGPVg/YEC5gsBL18I/AAAAAAAACw8/g8ABr7RU79kjnJocwCpfQ5wgy1WR0uHRACK4BGAYYCw/s1600/latest%2Blogo.png")

推荐阅读