MediaWiki:FadeIn.js: Difference between revisions
Appearance
No edit summary |
No edit summary |
||
Line 10: | Line 10: | ||
let rect = target.getBoundingClientRect(); | let rect = target.getBoundingClientRect(); | ||
screen.style.position = ' | screen.style.position = 'fixed'; | ||
screen.style.top = "0px"; | screen.style.top = "0px"; | ||
screen.style.left = '0px'; | screen.style.left = '0px'; |
Revision as of 20:58, 24 August 2025
const fadeInAttribute = "data-fadein"; const blurAttribute = "data-fadein-blur"; function createScreen(target) { if (target.tagName !== "DIV") { console.error(`Invalid target! ${target.tagName}`); return; } let screen = document.createElement(target.tagName); let rect = target.getBoundingClientRect(); screen.style.position = 'fixed'; screen.style.top = "0px"; screen.style.left = '0px'; screen.style.height = `${rect.height}px`; screen.style.width = `${rect.width}px`; screen.style.backgroundColor = 'rgba(255, 255, 255, 255, 0.3)'; let blur = "10"; screen.style.backdropFilter = `blur(${blur}px)`; screen.style.webkitBackdropFilter = `blur(${blur}px)`; screen.setAttribute(blurAttribute, blur); screen.style.zIndex = 1; if (target.getAttribute && target.getAttribute(fadeInAttribute) === "true") { screen._itv = setInterval((s) => { let blur = parseInt(s.getAttribute(blurAttribute)); if (blur <= 0) { clearInterval(s._itv); } else { blur = blur - 1; screen.style.backdropFilter = `blur(${blur}px)`; screen.style.webkitBackdropFilter = `blur(${blur}px)`; screen.setAttribute(blurAttribute, blur); } }, 300, screen) } target.appendChild(screen); } $(`[${fadeInAttribute}]`).each(function () { createScreen(this); });