找到
13
篇与
cutetuan
相关的结果
- 第 3 页
-
简洁美观的紫色加载页(自改开源) 声明 代码开源，来源于网络。 自改 1.开屏5秒自动消失 2.底部显示一言 3.背景改为淡紫色 loading.png图片 源码 index.html <!DOCTYPE html> <html> <head> <!-- 设置网页标题 --> <title>加载页演示</title> <!-- 引入外部样式表 --> <link rel="stylesheet" type="text/css" href="loading.css"> </head> <body> <!-- JavaScript代码块，用于在页面加载完成后执行 --> <script> // 当整个页面加载完成后执行以下函数 window.onload = function() { // 设置一个5秒后执行的定时器 setTimeout(function() { // 获取加载动画元素 var loader = document.querySelector('.loader'); // 将加载动画的透明度设置为0，开始渐变隐藏 loader.style.opacity = '0'; // 设置一个500毫秒后执行的定时器，用于完全隐藏加载动画 setTimeout(function() { // 将加载动画的显示设置为'none'，完全隐藏 loader.style.display = 'none'; }, 500); // 等待500毫秒以完成渐变效果 }, 5000); // 等待5秒 }; </script> <!-- 第二个JavaScript代码块，同样在页面加载完成后执行 --> <script> window.onload = function() { // 获取一言并显示 fetch('https://tenapi.cn/v2/yiyan') .then(response => response.text()) // 获取响应文本 .then(text => { // 将获取到的一言文本设置到页面元素中 document.getElementById('yiyan-text').textContent = text; // 显示一言，将透明度设置为1 document.getElementById('yiyan-text').style.opacity = 1; }) .catch(error => console.error('Error fetching yiyan:', error)); // 捕获并打印错误信息 // 等待一段时间后隐藏加载动画和一言 setTimeout(() => { // 获取加载动画元素 var loader = document.querySelector('.loader'); // 将加载动画和一言的透明度设置为0，开始渐变隐藏 loader.style.opacity = '0'; document.getElementById('yiyan-text').style.opacity = '0'; // 设置一个500毫秒后执行的定时器，用于完全隐藏加载动画 setTimeout(() => { // 将加载动画的显示设置为'none'，完全隐藏 loader.style.display = 'none'; }, 500); // 等待500毫秒以完成渐变效果 }, 5000); // 等待5秒 }; </script> </body> </html>loading.css .loader { background: #9370db; /* 淡紫色 */ background: radial-gradient(#9370db, #9370db); /* 淡紫色渐变 */ bottom: 0; left: 0; overflow: hidden; position: fixed; right: 0; top: 0; z-index: 99999; } .loading-text { color: white; /* 文字颜色为白色 */ position: absolute; bottom: 10%; /* 根据需要调整文字位置 */ left: 0; right: 0; text-align: center; /* 文字居中显示 */ font-size: 20px; /* 根据需要调整文字大小 */ margin-top: 50px; /* 添加上边距，确保文字在图标下方 */ } /* 现有的l.js样式内容 ... */ #yiyan-text { color: white; /* 文字颜色为白色 */ position: fixed; /* 使用fixed定位使其相对于视口固定 */ left: 0; right: 0; bottom: 0; /* 将其放置在底部 */ text-align: center; /* 文字居中显示 */ font-size: 20px; /* 根据需要调整文字大小 */ padding: 10px; /* 添加一些内边距 */ background-color: rgba(0, 0, 0, 0.5); /* 半透明的背景色，以便文字可读 */ z-index: 9999; /* 确保其在其他内容之上 */ opacity: 0; /* 初始状态不显示 */ transition: opacity 0.2s ease-out; /* 渐变效果 */ } .loader-inner { bottom: 0; height: 120px; /* 增加高度以容纳文字 */ left: 0; margin: auto; position: absolute; right: 0; top: 0; width: 100px; } .loader-line-wrap { animation: spin 2000ms cubic-bezier(.175, .885, .32, 1.275) infinite ; box-sizing: border-box; height: 50px; left: 0; overflow: hidden; position: absolute; top: 0; transform-origin: 50% 100%; width: 100px; } .loader-line { border: 4px solid transparent; border-radius: 100%; box-sizing: border-box; height: 100px; left: 0; margin: 0 auto; position: absolute; right: 0; top: 0; width: 100px; } .loader-line-wrap:nth-child(1) { animation-delay: -50ms; } .loader-line-wrap:nth-child(2) { animation-delay: -100ms; } .loader-line-wrap:nth-child(3) { animation-delay: -150ms; } .loader-line-wrap:nth-child(4) { animation-delay: -200ms; } .loader-line-wrap:nth-child(5) { animation-delay: -250ms; } .loader-line-wrap:nth-child(1) .loader-line { border-color: hsl(0, 80%, 60%); height: 90px; width: 90px; top: 7px; } .loader-line-wrap:nth-child(2) .loader-line { border-color: hsl(60, 80%, 60%); height: 76px; width: 76px; top: 14px; } .loader-line-wrap:nth-child(3) .loader-line { border-color: hsl(120, 80%, 60%); height: 62px; width: 62px; top: 21px; } .loader-line-wrap:nth-child(4) .loader-line { border-color: hsl(180, 80%, 60%); height: 48px; width: 48px; top: 28px; } .loader-line-wrap:nth-child(5) .loader-line { border-color: hsl(240, 80%, 60%); height: 34px; width: 34px; top: 35px; } @keyframes spin { 0%, 15% { transform: rotate(0); } 100% { transform: rotate(360deg); } }
-
随机二次元图片api(附源码+图库) 声明 公益服务，请勿滥用，图库来源于网络API 二次元风景API地址：https://api.cutetuan.cn/AcgnPic 4k壁纸图片API地址：https://api.cutetuan.cn/4k 若在一个网页中需要使用多张随机图片，但是又怕重复，可以在后面加上?id=1之类的image.png图片 源码 <?php // 设置HTTP头信息，防止浏览器缓存 header("Cache-Control: no-cache, no-store, must-revalidate"); // HTTP 1.1. header("Pragma: no-cache"); // HTTP 1.0. header("Expires: 0"); // Proxies. // 读取images.txt文件中的图片URL列表 $images = file('images.txt', FILE_IGNORE_NEW_LINES | FILE_SKIP_EMPTY_LINES); // 检查images.txt文件是否为空或不存在 if (empty($images)) { die('图片走丢啦，联系站长：937319686'); } // 随机选择一个图片URL $randomImage =$images[array_rand($images)]; // 重定向到随机选择的图片URL header('Location: ' . $randomImage); exit; ?> 注意： 图片放在images目录下。 图库： 高速图片地址可以找团子要，QQ:937319686
-
我高一啦！ 上岸 不知不觉初中三年就这样从我手中溜走了，不得不感叹时间过得真快。 中考也是成功上岸了！中考614分，被大同市博盛中学录取（私立） 军训 军训期间，我被选进了国旗班，国旗班训练更苦更累，但是好在有优先打饭的特权。 我们学校军训的项目还挺多，有棍术、军体拳、刺杀术、医疗急救等等（可以自由报名或者每班里选同学） 闭营那天场面是真热闹，有模拟反恐演习，道具挺齐全，还有烟雾、训练用枪、激光导弹、烟花、灭火球。 遗憾，闭营那天，国旗班作为第一个方阵最先出场的，但是踢正步的时候集体“放鞭炮”，我们训练的时候老整齐了。 学校 食堂 博盛的饭菜是真的很棒。 早上：早餐比较简单，有鸡蛋、饼、玉米、粥、面等 中午：午餐比较丰盛，菜偏荤，其他的有水果（西瓜）、面等 晚上：晚餐也是很棒，菜偏素，其他的有牛奶、面等 没错，早中晚都有面（豆面或者刀削面，都是机器现压、先削的），不限量，但是需要排会儿队。 All in all（总体来说），干净（明厨亮灶）、丰盛（每顿5个菜）、健康（早上鸡蛋、中午水果、晚上牛奶）、自由（可以自己加调料）、责任（食堂主任很热情，解决问题很负责任） 军训那会儿 每天下午有西瓜，可以吃到撑的那种。 每天有绿豆汤，旁边还放了一大筐（不知道用什么量词了）糖，自由加。 感觉好贴心 设施 教室里配希沃白板、电子班牌、高拍仪。 教学楼走廊里还有休息的地方，有沙发、桌子。 宿舍 这就夸不下去了，跟💩一样。 洗漱：水龙头没热水，还得单独去水房接热水。 洗手池：设计不错，但是实际上用的时候很鸡肋，洗头卡脑袋。 宿舍里：铁床，高中部一个宿舍8人。 学费 每年5万，估计都用在伙食上了。 结尾 总的来说，还不错，不知道开学后的体验咋样。 二编 2025.3.8日编辑傻逼学校傻逼老师傻逼食堂傻逼宿管傻逼主任傻逼跑操傻逼作业傻逼放假安排傻逼校长傻逼早读傻逼晚自习傻逼广播傻逼班委
