页面还未加载完成显示loading

页面未加载完成，显示loading的图标

html代码

<div id="loading"><i></i>
</div>

css 代码

#loading{width: 100%;height: 100%;background-color: #fff;position: fixed;top:0;left: 0;z-index: 9999;
}#loading >i{width: 64px;height: 64px;position: absolute;top:0;bottom:0;left:0;right: 0;margin: auto;background: url("/images/loading.gif") no-repeat;}

js代码

document.onreadystatechange = function () {if(document.readyState === "complete"){$("#loading").fadeOut();}
}

推荐一款loading图标的网站，可以自己配置颜色背景色

https://icons8.com/preloaders/

欢迎关注我的个人技术公众号！javascript艺术

页面还未加载完成显示loading相关推荐

html加载完显示图片,js图片未加载完显示loading效果
js图片未加载完显示loading效果 img{float:left;200px;height:200px;margin:0 10px 10px 0} //判断浏览器 var Browser=new ...
[html] iOS下页面如何启动加载时显示画面图片？如何设置大小？它有什么好处？
[html] iOS下页面如何启动加载时显示画面图片?如何设置大小?它有什么好处? <link rel="apple-touch-startup-image" href=&q ...
运行uniapp项目，提示uniapp依赖插件还未加载，请稍后重试
问题描述: 新创建的uniapp项目运行提示uniapp依赖插件还未加载,请稍后重试解决: 在HBuilder X开发工具里选择-工具===>插件安装===>安装相关插件主要是App真 ...
网络图片加载时显示loading
网页中一般都会有图片加载,但是当遇到图片较大,而网络较慢或者服务器宽带较小时,图片加载就会变慢,加载工程中图片区域会显示空白,用户体验会不太好,这时候在加载时放一个动画,可能会缓解用户等待的焦急情绪, ...
js在html之前加载,js加载前显示loading（页面加载前）
工作中遇到,需要加loading.1.用jquery的load方法读取页面,页面读取完成前显示loading.2.首页js等加载过慢,页面加载完成前显示loading. (1).jquery .loa ...
ajax的loading方法,Ajax加载中显示loading的方法
使用ajaxStart方法定义一个全局的"加载中..."提示$(function(){ $("#loading").ajaxStart(function(){ ...
img加载中显示loading，加载失败显示默认图片（React）
实现效果完整代码 import { useRef, useState } from 'react'; import './index.less'; import errorImg from '@/c ...
img加载中显示loading，加载失败隐藏img并显示自定义内容而且可点击重新加载（React）
图片加载效果完整代码 import { useRef, useState } from 'react'; import './index.less';export default function ...
问题：jquery给标签添加事件，但标签还未加载会成功吗
之后研究解决转载于:https://www.cnblogs.com/sz-toosimple/p/11170912.html

页面还未加载完成显示loading

页面还未加载完成显示loading相关推荐

最新文章

热门文章