简单的视频预加载html页面

在桌面新建一个txt文档后缀改为html(不显示文件后缀的可自行百度设置),把文章最后的代码复制粘贴进去即可。

苹果cms可在后台里面的系统-播放器参数设置

简单的视频预加载html页面

按照图片里的链接格式设置即可

代码如下:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Loading Animation</title>
<style>
body {
display: flex;
align-items: center;
justify-content: center;
height: 100vh;
margin: 0;
background-color: #000; /* 将背景颜色改为黑色 */
}

.loading-container {
text-align: center;
color: #fff; /* 设置文本颜色为白色 */
}

.loading-spinner {
border: 4px solid rgba(255, 255, 255, 0.1); /* 将边框颜色改为白色 */
border-top: 4px solid #3498db;
border-radius: 50%;
width: 40px;
height: 40px;
animation: spin 1s linear infinite;
margin-bottom: 10px;
}

@keyframes spin {
0% { transform: rotate(0deg); }
100% { transform: rotate(360deg); }
}
</style>
</head>
<body>
<div class="loading-container">
<div class="loading-spinner"></div>
<p>加载中...</p>
</div>
</body>
</html>

版权声明:图图 发表于 2023-12-24 8:34:08。
转载请注明:简单的视频预加载html页面 | 站长资源站Pro|站长资源|建站教程