MediaWiki:Common.js:修订间差异
来自Fuckrooms Wiki
无编辑摘要 标签:已被回退 |
Defaultuser6(留言 | 贡献) 无编辑摘要 |
||
(未显示3个用户的18个中间版本) | |||
第1行: | 第1行: | ||
/* 这里的任何JavaScript将为所有用户在每次页面加载时加载。 */ | |||
// console.log("Hello World!"); | |||
/* CSS模板 */ | |||
(function() { | (function() { | ||
var importCssDivs = document.querySelectorAll('div.import-css'); | var importCssDivs = document.querySelectorAll('div.import-css'); | ||
第14行: | 第18行: | ||
}); | }); | ||
})(); | })(); | ||
/* 落叶特效 */ | |||
(function(){ | |||
if (!document.getElementById('snow-style')) { | if (!document.getElementById('snow-style')) { | ||
const style = document.createElement('style'); | const style = document.createElement('style'); | ||
style.id = 'snow-style'; | style.id = 'snow-style'; | ||
style.textContent = ` | style.textContent = ` | ||
@keyframes | @keyframes snowRise { | ||
0% { transform: translateY( | 0% { | ||
100% { transform: translateY(calc( | transform: translateY(0) rotate(0deg); | ||
bottom: -130px; | |||
} | |||
100% { | |||
transform: translateY(-100vh) rotate(80deg); | |||
bottom: calc(100% + 130px); | |||
} | |||
} | } | ||
.snowflake { | .snowflake { | ||
position: fixed; | position: fixed; | ||
bottom: -130px; | |||
z-index: 9999; | z-index: 9999; | ||
pointer-events: none; | pointer-events: none; | ||
user-select: none; | user-select: none; | ||
animation-timing-function: linear; | animation-timing-function: linear; | ||
will-change: transform; | |||
} | } | ||
`; | `; | ||
document.head.appendChild(style); | document.head.appendChild(style); | ||
} | } | ||
function createSnowflake() { | function createSnowflake() { | ||
const snowflake = document.createElement('div'); | const snowflake = document.createElement('div'); | ||
snowflake.className = 'snowflake'; | snowflake.className = 'snowflake'; | ||
const icons = [' | const icons = ['🎂','🎂']; | ||
snowflake.innerHTML = icons[Math.floor(Math.random() * | snowflake.innerHTML = icons[Math.floor(Math.random() * icons.length)]; | ||
const size = Math.random() * | const size = Math.random() * 32 + 8; | ||
const left = Math.random() * 100; | const left = Math.random() * 100; | ||
const duration = Math.random() * 8 + 8; | const duration = Math.random() * 8 + 8; | ||
第50行: | 第59行: | ||
font-size: ${size}px; | font-size: ${size}px; | ||
left: ${left}%; | left: ${left}%; | ||
animation: | animation: snowRise ${duration}s linear forwards; | ||
opacity: ${Math.random() * 0.5 + 0.5}; | opacity: ${Math.random() * 0.5 + 0.5}; | ||
color: hsl(${Math.random() * 360}, 100%, 90%); | color: hsl(${Math.random() * 360}, 100%, 90%); | ||
`; | `; | ||
// 确保动画结束后移除元素 | |||
const removeSnowflake = () => { | |||
snowflake.remove(); | snowflake.remove(); | ||
}); | snowflake.removeEventListener('animationend', removeSnowflake); | ||
}; | |||
snowflake.addEventListener('animationend', removeSnowflake); | |||
document.body.appendChild(snowflake); | document.body.appendChild(snowflake); | ||
} | } | ||
let interval = setInterval(createSnowflake, 250); | let interval = setInterval(createSnowflake, 250); | ||
document.addEventListener('visibilitychange', function() { | document.addEventListener('visibilitychange', function() { | ||
if (document.hidden) { | if (document.hidden) { | ||
第75行: | 第84行: | ||
}); | }); | ||
// 初始创建雪花 | |||
for (let i = 0; i < 10; i++) { | for (let i = 0; i < 10; i++) { | ||
createSnowflake(); | 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(); } })();