MediaWiki:Citizen.js:修订间差异
MediaWiki界面页面
更多操作
无编辑摘要 |
无编辑摘要 |
||
| 第9行: | 第9行: | ||
document.body.appendChild(ptr); | document.body.appendChild(ptr); | ||
const css = document.createElement('style'); | const css = document.createElement('style'); | ||
css.textContent = ` | css.textContent = ` | ||
/* 浅色模式:原版亮绿 */ | |||
.magnetic-true-corner i{ | |||
position:absolute; | |||
width:14px;height:14px; | |||
border:2px solid #17f700; | |||
background:transparent!important; | |||
box-shadow:none!important; | |||
} | |||
/* ========== Citizen 真正暗黑模式精准匹配 ========== */ | |||
html[data-color-scheme="dark"] .magnetic-true-corner i { | |||
border-color: #4fc3f7 !important; | |||
} | |||
.magnetic-true-corner{ | |||
position:fixed; | |||
left:0;top:0; | |||
width:0;height:0; | |||
pointer-events:none; | |||
z-index:999999!important; | |||
} | |||
.magnetic-true-corner i:nth-child(1){top:-2px;left:-2px;border-right:none;border-bottom:none;} | |||
.magnetic-true-corner i:nth-child(2){top:-2px;right:-2px;border-left:none;border-bottom:none;} | |||
.magnetic-true-corner i:nth-child(3){bottom:-2px;left:-2px;border-right:none;border-top:none;} | |||
.magnetic-true-corner i:nth-child(4){bottom:-2px;right:-2px;border-left:none;border-top:none;} | |||
`; | `; | ||
document.head.appendChild(css); | document.head.appendChild(css); | ||
| 第51行: | 第48行: | ||
}); | }); | ||
function loop(){ | function loop(){ | ||
const ease = 0.15; | const ease = 0.15; | ||
| 第82行: | 第78行: | ||
loop(); | loop(); | ||
// | // 保留你所有自定义按钮 + commentstreams + citizen原生 | ||
const sel = [ | const sel = [ | ||
'.citizen-nav a', | '.citizen-nav a', | ||
2026年3月31日 (二) 16:10的版本
(function() {
if( window.magneticCursorInit ) return;
window.magneticCursorInit = true;
mw.loader.using( [], function() {
const ptr = document.createElement('div');
ptr.className = 'magnetic-true-corner';
ptr.innerHTML = `<i></i><i></i><i></i><i></i>`;
document.body.appendChild(ptr);
const css = document.createElement('style');
css.textContent = `
/* 浅色模式:原版亮绿 */
.magnetic-true-corner i{
position:absolute;
width:14px;height:14px;
border:2px solid #17f700;
background:transparent!important;
box-shadow:none!important;
}
/* ========== Citizen 真正暗黑模式精准匹配 ========== */
html[data-color-scheme="dark"] .magnetic-true-corner i {
border-color: #4fc3f7 !important;
}
.magnetic-true-corner{
position:fixed;
left:0;top:0;
width:0;height:0;
pointer-events:none;
z-index:999999!important;
}
.magnetic-true-corner i:nth-child(1){top:-2px;left:-2px;border-right:none;border-bottom:none;}
.magnetic-true-corner i:nth-child(2){top:-2px;right:-2px;border-left:none;border-bottom:none;}
.magnetic-true-corner i:nth-child(3){bottom:-2px;left:-2px;border-right:none;border-top:none;}
.magnetic-true-corner i:nth-child(4){bottom:-2px;right:-2px;border-left:none;border-top:none;}
`;
document.head.appendChild(css);
let hoverEl = null;
let mx = 0, my = 0;
let smoothX = 0, smoothY = 0;
let curW = 40, curH = 40;
document.addEventListener('mousemove', e => {
mx = e.clientX;
my = e.clientY;
});
function loop(){
const ease = 0.15;
if(hoverEl){
const r = hoverEl.getBoundingClientRect();
const targetX = r.left + r.width / 2;
const targetY = r.top + r.height / 2;
smoothX += (targetX - smoothX) * ease;
smoothY += (targetY - smoothY) * ease;
curW = r.width;
curH = r.height;
ptr.style.left = (smoothX - curW / 2) + 'px';
ptr.style.top = (smoothY - curH / 2) + 'px';
ptr.style.width = curW + 'px';
ptr.style.height = curH + 'px';
}else{
curW = 40;
curH = 40;
smoothX += (mx - smoothX) * ease;
smoothY += (my - smoothY) * ease;
ptr.style.left = (smoothX - 20) + 'px';
ptr.style.top = (smoothY - 20) + 'px';
ptr.style.width = curW + 'px';
ptr.style.height = curH + 'px';
}
requestAnimationFrame(loop);
}
loop();
// 保留你所有自定义按钮 + commentstreams + citizen原生
const sel = [
'.citizen-nav a',
'.citizen-menu a',
'.citizen-button',
'.citizen-action-button',
'.cdx-button',
'.mw-editsection a',
'#citizen-header__nav a',
'.citizen-sidebar a',
'._target',
'.commentstreams-button',
'.commentstreams-submit',
'.commentstreams-header button',
'.commentstreams-box button',
'.mw-ui-button',
'button',
'a[role="button"]'
].join(',');
function bind(){
document.querySelectorAll(sel).forEach(el=>{
if(el._magBind)return;
el._magBind = 1;
el.addEventListener('mouseenter', ()=> hoverEl = el);
el.addEventListener('mouseleave', ()=> hoverEl = null);
});
}
bind();
new MutationObserver(bind).observe(document.body,{childList:true,subtree:true});
});
})();