MediaWiki:Common.js
来自勿忘草与永远的少女
注意:在发布之后,您可能需要清除浏览器缓存才能看到所作出的变更的影响。
- Firefox或Safari:按住Shift的同时单击刷新,或按Ctrl-F5或Ctrl-R(Mac为⌘-R)
- Google Chrome:按Ctrl-Shift-R(Mac为⌘-Shift-R)
- Internet Explorer或Edge:按住Ctrl的同时单击刷新,或按Ctrl-F5
- Opera:按 Ctrl-F5。
/* 这里的任何JavaScript将为所有用户在每次页面加载时加载。 */
$(function() {
// 检查是否已存在导航栏,避免重复添加
if ($('.fixed-top-nav').length === 0) {
// 导航栏 HTML 结构
var navHtml = `
<div class="fixed-top-nav">
<a href="首页" class="nav-logo">
<img src="/wikibg/logo.jpg" alt="网站Logo">
<span>万华镜</span>
</a>
<div class="nav-links">
<a href="首页" class="nav-link">
📚 首页
</a>
<a href="游戏攻略" class="nav-link">
📖 游戏攻略
</a>
<a href="棋子" class="nav-link">
⚔️ 棋子图鉴
</a>
<a href="天赋图鉴" class="nav-link">
🗺️ 天赋图鉴
</a>
<a href="装备图鉴" class="nav-link">
📊 装备图鉴
</a>
<a href="https://www.war3whj.top/war3wiki/moniqi/moniqi.html" class="nav-link">
📊 阵容模拟器
</a>
</div>
</div>
`;
// 将导航栏插入到 body 开头
$('body').prepend(navHtml);
// 滚动时添加效果(可选)
$(window).scroll(function() {
if ($(window).scrollTop() > 50) {
$('.fixed-top-nav').addClass('scrolled');
} else {
$('.fixed-top-nav').removeClass('scrolled');
}
});
}
});
$(function() {
// 确保页脚固定在底部
var footer = $('#footer, .mw-footer');
if (footer.length > 0) {
// 设置底部内边距避免内容被遮挡
var footerHeight = footer.outerHeight();
$('body').css('padding-bottom', footerHeight + 20 + 'px');
// 窗口大小改变时重新计算
$(window).resize(function() {
var newHeight = footer.outerHeight();
$('body').css('padding-bottom', newHeight + 20 + 'px');
});
}
});
$(function() {
// 为角色卡片添加悬停效果(可选,纯CSS已有,这里作为备用)
$('.character-card').hover(
function() { $(this).addClass('hover'); },
function() { $(this).removeClass('hover'); }
);
// 动态计算右侧边栏高度(可选,用于对齐)
function adjustSidebarHeight() {
var leftHeight = $('.custom-homepage .left-column').outerHeight();
var rightHeight = $('.custom-homepage .right-column').outerHeight();
if (rightHeight < leftHeight && $(window).width() > 768) {
$('.custom-homepage .right-column').css('min-height', leftHeight);
}
}
// 延迟执行,等待图片加载完成
setTimeout(adjustSidebarHeight, 500);
$(window).resize(adjustSidebarHeight);
});
// 棋子图鉴筛选器
$(function() {
function bindFilter() {
$('.filter-btn').off('click').on('click', function() {
$('.filter-btn').removeClass('active');
$(this).addClass('active');
var rarity = $(this).data('rarity');
$('#character-table tr').each(function() {
if ($(this).find('th').length) return;
if (rarity === 'all') {
$(this).show();
} else {
var rowRarity = $(this).find('td:nth-child(3)').text();
if (rowRarity === rarity) {
$(this).show();
} else {
$(this).hide();
}
}
});
});
}
// 等待表格加载完成后绑定(因为 #ask 是异步的)
if ($('#character-table').length) {
var observer = new MutationObserver(function() {
if ($('#character-table tr').length > 1) {
bindFilter();
observer.disconnect();
}
});
observer.observe(document.getElementById('character-table'), {
childList: true,
subtree: true
});
// 初始尝试绑定
bindFilter();
}
});