微件:CodeLoadingUI/SCF:修订间差异

来自SOKA CAFE
第71行: 第71行:
     z-index: -1; /* 背景图片在底层 */
     z-index: -1; /* 背景图片在底层 */
     background-position: center !important;
     background-position: center !important;
    display: none; /* 初始状态下隐藏背景图片 */
   }
   }


第109行: 第110行:


<!-- 背景图片容器 -->
<!-- 背景图片容器 -->
<div class="Cbackground" id="Cbackground" data-file="{{filepath:{{{图片|迪普菲协奏会.png}}}}}"></div>
<div class="Cbackground" id="Cbackground" data-file="{{filepath:宗教都市祭封面1 V2.PNG}}"></div>


<!-- JavaScript 逻辑 -->
<!-- JavaScript 逻辑 -->
第127行: 第128行:
         var Cbackground = document.getElementById("Cbackground");
         var Cbackground = document.getElementById("Cbackground");
         var file = Cbackground.getAttribute("data-file");
         var file = Cbackground.getAttribute("data-file");
         Cbackground.setAttribute('style', 'background:url(' + file + ')');
         Cbackground.style.background = 'url(' + file + ')';
        Cbackground.style.display = 'block'; // 显示背景图片
 
         var wrapper = document.getElementById("mw-wrapper");
         var wrapper = document.getElementById("mw-wrapper");
         if (wrapper) {
         if (wrapper) {

2025年3月2日 (日) 10:02的版本

<style>

 /* 全屏覆盖层 */
 #loadingOverlay {
   position: fixed;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   background: #000;
   display: flex;
   justify-content: center;
   align-items: center;
   flex-direction: column;
   z-index: 1000; /* 确保加载界面在最上层 */
   color: #fff;
   font-family: monospace;
 }
 /* 加载动画 */
 .loader {
   border: 5px solid #f3f3f3;
   border-top: 5px solid #3498db;
   border-radius: 50%;
   width: 50px;
   height: 50px;
   animation: spin 1s linear infinite;
 }
 @keyframes spin {
   0% { transform: rotate(0deg); }
   100% { transform: rotate(360deg); }
 }
 /* 进度条 */
 #progressBar {
   width: 200px;
   height: 10px;
   background: #444;
   margin-top: 20px;
   border-radius: 5px;
   overflow: hidden;
 }
 #progressBar div {
   height: 100%;
   width: 0;
   background: #3498db;
   transition: width 0.5s ease;
 }
 /* 模拟代码样式 */
 #codeDisplay {
   margin-top: 20px;
   background: #222;
   padding: 10px;
   border-radius: 5px;
   width: 80%;
   max-width: 600px;
   overflow: auto;
   white-space: pre-wrap;
 }
 /* 背景图片样式 */
 .Cbackground {
   position: fixed;
   background-size: cover !important;
   top: 0;
   width: 100%;
   height: 100%;
   z-index: -1; /* 背景图片在底层 */
   background-position: center !important;
   display: none; /* 初始状态下隐藏背景图片 */
 }
 #mw-content-container { background: rgba(255, 255, 255, 0.6); }
 #mw-content, .sidebar-chunk {
   background: rgba(255, 255, 255, 0.7) !important;
   backdrop-filter: blur(20px);
 }

</style>

   Loading system...
   dir /s /b shukyo_city_festival
   File Not Found
   dir /s /b *shukyo_city_festival
   Finding…
   ┗ admin:File Not Found
   ┗ adult:File Not Found
   ┗ alternative:File Not Found
   ┗ credit:File Not Found
   ┗ declassified:File Not Found
   ┗ fragment:File Not Found
   ┗ system:File Not Found
   ┗ thous:【合作】宗教都市祭 ~ Shukyo City Festival
   >/thous:【合作】宗教都市祭 ~ Shukyo City Festival

<script>

 // 确保DOM加载完成后再执行脚本
 document.addEventListener('DOMContentLoaded', function () {
   var progress = 0;
   var progressBar = document.getElementById('progressBar').querySelector('div');
   var interval = setInterval(function () {
     progress += 10;
     progressBar.style.width = progress + '%';
     if (progress >= 100) {
       clearInterval(interval);
       document.getElementById('loadingOverlay').style.display = 'none'; // 隐藏加载界面
       // 加载背景图片
       var Cbackground = document.getElementById("Cbackground");
       var file = Cbackground.getAttribute("data-file");
       Cbackground.style.background = 'url(' + file + ')';
       Cbackground.style.display = 'block'; // 显示背景图片
       var wrapper = document.getElementById("mw-wrapper");
       if (wrapper) {
         wrapper.appendChild(Cbackground);
       }
     }
   }, 300);
 });

</script>