fix: 修复移动端 UI 问题

- 修复侧边抽屉文章目录在 PJAX 页面切换后不重新初始化的问题
- 优化涟漪点击效果:将结束动画从 scale 收缩改为 opacity 淡出
- 添加暗黑/明亮模式切换过渡动画(250ms 平滑过渡)
- 优化分享面板动画:添加退出时的反向错落延迟
- 添加分享面板移动端响应式适配,防止视口溢出
This commit is contained in:
2026-01-11 22:43:57 +08:00
parent f8d7c79b86
commit db24ca2043
6 changed files with 209 additions and 32 deletions

View File

@@ -2397,6 +2397,10 @@ $(document).pjax("a[href]:not([no-pjax]):not(.no-pjax):not([target='_blank']):no
}).on('pjax:end', function() {
waterflowInit();
lazyloadInit();
// 重置移动端目录状态
if (typeof window.resetMobileCatalog === 'function') {
window.resetMobileCatalog();
}
// GT4: PJAX 后确保评论页验证码已初始化
try {
if ($('#geetest-captcha').length > 0) {
@@ -2523,10 +2527,11 @@ $(document).on("click" , "#blog_categories .tag" , function(){
});
// ========== 移动端文章目录初始化 ==========
var mobileCatalogInitialized = false;
// 使用全局变量以便 PJAX 后重置
window.mobileCatalogInitialized = false;
function initMobileCatalog() {
if (mobileCatalogInitialized) return;
if (window.mobileCatalogInitialized) return;
if ($("#leftbar_mobile_catalog").length === 0) return;
if ($("#post_content").length === 0) return;
@@ -2543,7 +2548,7 @@ $(document).on("click" , "#blog_categories .tag" , function(){
linkClass: "index-link",
offset: 80,
});
mobileCatalogInitialized = true;
window.mobileCatalogInitialized = true;
// 初始化后滚动到当前位置
setTimeout(scrollMobileCatalogToActive, 150);
} else {
@@ -2557,6 +2562,12 @@ $(document).on("click" , "#blog_categories .tag" , function(){
setTimeout(tryInit, 50);
}
// 重置移动端目录状态(供 PJAX 调用)
window.resetMobileCatalog = function() {
window.mobileCatalogInitialized = false;
$("#leftbar_mobile_catalog").empty();
};
// 滚动目录到当前激活项
function scrollMobileCatalogToActive() {
var container = $("#leftbar_mobile_catalog");
@@ -2576,7 +2587,7 @@ $(document).on("click" , "#blog_categories .tag" , function(){
// 监听页面滚动,实时更新移动端目录高亮并自动滚动
var mobileCatalogScrollTimer = null;
$(window).on("scroll.mobileCatalog", function() {
if (!mobileCatalogInitialized) return;
if (!window.mobileCatalogInitialized) return;
// 节流处理
if (mobileCatalogScrollTimer) return;
mobileCatalogScrollTimer = setTimeout(function() {