MediaWiki:Common.js:修订间差异

来自Fuckrooms Wiki
无编辑摘要
无编辑摘要
 
(未显示4个用户的43个中间版本)
第1行: 第1行:
/* 这里的任何JavaScript将为所有用户在每次页面加载时加载。 */
// console.log("Hello World!");


(function(){
/* CSS模板 */
(function() {
  var importCssDivs = document.querySelectorAll('div.import-css');


window.leaves = window.leaves || [];
  importCssDivs.forEach(function(div) {
    var cssContent = div.textContent || div.innerText;


    if (cssContent) {
      var styleTag = document.createElement('style');
      styleTag.type = 'text/css';
  styleTag.appendChild(document.createTextNode(cssContent));


if(!document.getElementById('leafStyle')){
      document.head.appendChild(styleTag);
    const style = document.createElement('style');
     }
     style.id = 'leafStyle';
  });
    style.textContent = `
})();
        @keyframes leafFall {
            0%{ transform: translate(-20vw, -50px) rotate(0deg) }
            100%{ transform: translate(20vw, 120vh) rotate(1080deg) }
        }
        .leaf {
            position: fixed;
            z-index: 99999;
            pointer-events: none;
            font-size: 24px;
            opacity: 0.8;
            text-shadow: 1px 1px 2px #333;
        }
    `;
    document.head.appendChild(style);
}


/* 落叶特效 */
(function(){
    if (!document.getElementById('snow-style')) {
        const style = document.createElement('style');
        style.id = 'snow-style';
        style.textContent = `
            @keyframes snowRise {
                0% {
                    transform: translateY(0) rotate(0deg);
                    bottom: -130px;
                }
                100% {
                    transform: translateY(-100vh) rotate(80deg);
                    bottom: calc(100% + 130px);
                }
            }
            .snowflake {
                position: fixed;
                bottom: -130px;
                z-index: 9999;
                pointer-events: none;
                user-select: none;
                animation-timing-function: linear;
                will-change: transform;
            }
        `;
        document.head.appendChild(style);
    }


function createLeaf(){
    function createSnowflake() {
    const leaf = document.createElement('div');
        const snowflake = document.createElement('div');
    leaf.className = 'leaf';
        snowflake.className = 'snowflake';
    leaf.innerHTML = '🍃';  
        const icons = ['🎂','🎂'];
    leaf.style.cssText = `
        snowflake.innerHTML = icons[Math.floor(Math.random() * icons.length)];
         left: ${Math.random() * 100}%;
        const size = Math.random() * 32 + 8;
         color: ${['#8BC34A','#4CAF50','#388E3C'][Math.floor(Math.random()*3)]};
         const left = Math.random() * 100;
        animation: leafFall ${8 + Math.random()*12}s cubic-bezier(0.4,0,0.6,1) infinite;
         const duration = Math.random() * 8 + 8;
        filter: hue-rotate(${Math.random()*60}deg);
        snowflake.style.cssText = `
    `;
            font-size: ${size}px;
    document.body.appendChild(leaf);
            left: ${left}%;
    leaves.push(leaf);
            animation: snowRise ${duration}s linear forwards;
}
            opacity: ${Math.random() * 0.5 + 0.5};
            color: hsl(${Math.random() * 360}, 100%, 90%);
        `;


        // 确保动画结束后移除元素
        const removeSnowflake = () => {
            snowflake.remove();
            snowflake.removeEventListener('animationend', removeSnowflake);
        };
        snowflake.addEventListener('animationend', removeSnowflake);


function startFall(){
         document.body.appendChild(snowflake);
    setInterval(() => {
     }
         if(leaves.length < 50) {
            createLeaf();
            if(Math.random() > 0.8) createLeaf();
        }
    }, 800);
      
   
    setInterval(() => {
        leaves = leaves.filter(leaf => {
            if(leaf.getBoundingClientRect().top > window.innerHeight*1.2){
                leaf.remove();
                return false;
            }
            return true;
        });
    }, 5000);
}


    let interval = setInterval(createSnowflake, 250);


document.addEventListener('visibilitychange', () => {
    document.addEventListener('visibilitychange', function() {
    if(!document.hidden) startFall();
        if (document.hidden) {
});
            clearInterval(interval);
 
        } else {
            interval = setInterval(createSnowflake, 250);
        }
    });


startFall();
    // 初始创建雪花
    for (let i = 0; i < 10; i++) {
        createSnowflake();
    }
})();
})();

2025年8月8日 (五) 15:10的最新版本

/* 这里的任何JavaScript将为所有用户在每次页面加载时加载。 */
// console.log("Hello World!");

/* CSS模板 */
(function() {
  var importCssDivs = document.querySelectorAll('div.import-css');

  importCssDivs.forEach(function(div) {
    var cssContent = div.textContent || div.innerText;

    if (cssContent) {
      var styleTag = document.createElement('style');
      styleTag.type = 'text/css';
	  styleTag.appendChild(document.createTextNode(cssContent));

      document.head.appendChild(styleTag);
    }
  });
})();

/* 落叶特效 */
(function(){
    if (!document.getElementById('snow-style')) {
        const style = document.createElement('style');
        style.id = 'snow-style';
        style.textContent = `
            @keyframes snowRise {
                0% { 
                    transform: translateY(0) rotate(0deg); 
                    bottom: -130px;
                }
                100% { 
                    transform: translateY(-100vh) rotate(80deg); 
                    bottom: calc(100% + 130px);
                }
            }
            .snowflake {
                position: fixed;
                bottom: -130px;
                z-index: 9999;
                pointer-events: none;
                user-select: none;
                animation-timing-function: linear;
                will-change: transform;
            }
        `;
        document.head.appendChild(style);
    }

    function createSnowflake() {
        const snowflake = document.createElement('div');
        snowflake.className = 'snowflake';
        const icons = ['🎂','🎂'];
        snowflake.innerHTML = icons[Math.floor(Math.random() * icons.length)];
        const size = Math.random() * 32 + 8;
        const left = Math.random() * 100;
        const duration = Math.random() * 8 + 8;
        snowflake.style.cssText = `
            font-size: ${size}px;
            left: ${left}%;
            animation: snowRise ${duration}s linear forwards;
            opacity: ${Math.random() * 0.5 + 0.5};
            color: hsl(${Math.random() * 360}, 100%, 90%);
        `;

        // 确保动画结束后移除元素
        const removeSnowflake = () => {
            snowflake.remove();
            snowflake.removeEventListener('animationend', removeSnowflake);
        };
        snowflake.addEventListener('animationend', removeSnowflake);

        document.body.appendChild(snowflake);
    }

    let interval = setInterval(createSnowflake, 250);

    document.addEventListener('visibilitychange', function() {
        if (document.hidden) {
            clearInterval(interval);
        } else {
            interval = setInterval(createSnowflake, 250);
        }
    });

    // 初始创建雪花
    for (let i = 0; i < 10; i++) {
        createSnowflake();
    }
})();