53 lines
1.2 KiB
HTML
53 lines
1.2 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<title>页面加载进度效果</title>
|
|
<link rel="stylesheet" href="src/root.css">
|
|
<link rel="stylesheet" href="src/pace.css">
|
|
<link rel="stylesheet" href="src/preloader.css">
|
|
<link rel="stylesheet" href="src/loading.css">
|
|
<link rel="stylesheet" href="src/index.css">
|
|
</head>
|
|
<body>
|
|
|
|
<!-- LOGO -->
|
|
<div class="loading">
|
|
<span>网</span>
|
|
<span>塔</span>
|
|
<span>科</span>
|
|
<span>技</span>
|
|
</div>
|
|
|
|
<!-- 屏幕 -->
|
|
<div id="preloader"></div>
|
|
|
|
<script src="src/jquery-3.6.0.js"></script>
|
|
<!-- 处理JQ3.0版本兼容 -->
|
|
<script src="src/jquery-migrate-3.4.0.min.js"></script>
|
|
<!-- 页面加载进度 -->
|
|
<script src="src/pace.js"></script>
|
|
<script>
|
|
|
|
// 延时看效果 time = ？秒
|
|
$.get("http://wtkj.qiyejianzhan.wang/dtest.php?time=3", function (data) {
|
|
console.log(data);
|
|
});
|
|
|
|
// 页面加载进度条配置
|
|
paceOptions = {
|
|
ajax: true,
|
|
document: true,
|
|
eventLag: false
|
|
};
|
|
|
|
// 网页加载结束后执行
|
|
Pace.on("done", function () {
|
|
console.log('paceDone')
|
|
$('#preloader').addClass("isdone");
|
|
$('.loading').addClass("isdone");
|
|
});
|
|
|
|
</script>
|
|
</body>
|
|
</html> |