1页面无评论区 DOM             → 隐藏（主页、说说页等无评论区页面）
2滚动位置 < 300px             → 隐藏（页面顶部，不需要快捷跳转）
3滚动位置 > 300px 且评论区在视口下方 → 显示 ✅
4滚动位置 > 300px 且评论区已进入视口  → 隐藏（已经看到了评论区）

 1{{/* 💬 评论跳转按钮 - 独立fixed定位，JS根据页面是否存在评论区控制显隐 */}}
 2<button id="scroll-to-comment" class="scroll-to-comment"
 3        aria-label="跳转到评论区" title="跳转到评论区">
 4  <svg class="comment-icon" width="22" height="22"
 5       viewBox="0 0 24 24" fill="none" stroke="currentColor"
 6       stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
 7    <path d="M21 11.5a8.38 8.38 0 0 1-.9 3.8 8.5 8.5 0 0 1-7.6 4.7
 8             8.38 8.38 0 0 1-3.8-.9L3 21l1.9-5.7a8.38 8.38 0 0 1-.9-3.8
 9             8.5 8.5 0 0 1 4.7-7.6 8.38 8.38 0 0 1 3.8-.9h.5a8.48 8.48
10             0 0 1 8 8v.5z"/>
11  </svg>
12</button>

 1.scroll-to-comment {
 2  position: fixed;
 3  bottom: 6.5rem;          /* 位于返回顶部按钮上方 */
 4  right: 1.5rem;
 5  width: 46px;
 6  height: 46px;
 7  background: #3b82f6;     /* 蓝色，与评论主题色一致 */
 8  border: none;
 9  border-radius: 50%;
10  cursor: pointer;
11  box-shadow: 0 4px 16px rgba(59,130,246,.3);
12  display: none;            /* 初始隐藏 */
13  align-items: center;
14  justify-content: center;
15  z-index: 998;
16  opacity: 0;
17  transform: translateY(16px);
18  pointer-events: none;     /* 隐藏时不可点击 */
19  transition: all .3s ease;
20}

 1// 显示时：先设 display，再设 opacity（确保过渡动画生效）
 2commentBtn.style.display = 'flex';
 3commentBtn.style.opacity = '1';
 4commentBtn.style.transform = 'translateY(0)';
 5commentBtn.style.pointerEvents = 'auto';
 6
 7// 隐藏时：先设 opacity，过渡完成后再设 display
 8commentBtn.style.opacity = '0';
 9commentBtn.style.transform = 'translateY(16px)';
10commentBtn.style.pointerEvents = 'none';

 1if (commentBtn) {
 2  // 查找评论区容器（按优先级尝试多种选择器）
 3  // 注意：不包含 .moments-comments-section，说说页评论靠点击展开，无需气泡跳转
 4  var commentSection = document.querySelector(
 5    '#post-comments,.post-comments,.comments-section,#tcomment,' +
 6    '.music-comments-section,.gal-comments-section'
 7  );
 8
 9  // 核心条件：必须检测到评论区 DOM 且滚动超过 300px
10  // 主页无评论区 DOM → commentSection 为 null → 永远不显示
11  var showComment = commentSection && scrollTop > 300;
12
13  // 进阶条件：如果评论区存在，检查是否已滚到评论区
14  if (showComment) {
15    var cTop = commentSection.getBoundingClientRect().top + window.scrollY;
16    showComment = scrollTop + window.innerHeight < cTop - 80;
17  }
18
19  // 通过内联 style 控制显隐
20  if (showComment) {
21    commentBtn.style.display = 'flex';
22    commentBtn.style.opacity = '1';
23    commentBtn.style.transform = 'translateY(0)';
24    commentBtn.style.pointerEvents = 'auto';
25  } else {
26    commentBtn.style.opacity = '0';
27    commentBtn.style.transform = 'translateY(16px)';
28    commentBtn.style.pointerEvents = 'none';
29  }
30}

1// 旧版：不依赖评论区存在，主页滚动>300px也会显示气泡
2var showComment = scrollTop > 300;
3if (commentSection && showComment) { ... }
4
5// 新版：必须检测到评论区DOM才允许显示
6var showComment = commentSection && scrollTop > 300;
7if (showComment) { ... }

 1commentBtn.addEventListener('click', function(e) {
 2  e.preventDefault();
 3  // 实时查找评论区（确保异步加载后也能找到）
 4  var target = document.querySelector(
 5    '#post-comments,.post-comments,.comments-section,#tcomment,' +
 6    '.music-comments-section,.gal-comments-section'
 7  );
 8  if (!target) return;
 9
10  // 计算偏移量：导航栏高度 + 20px 间距
11  var navH = parseInt(
12    getComputedStyle(document.documentElement)
13      .getPropertyValue('--header-offset')
14  ) || 80;
15  var t = target.getBoundingClientRect().top + window.pageYOffset - navH - 20;
16
17  window.scrollTo({ top: t, behavior: 'smooth' });
18});

1title: "不需要评论的文章"
2comments: false

1var showComment = commentSection && scrollTop > 300;  // 修改 300 调整触发滚动的像素阈值

1.scroll-to-comment {
2  bottom: 6.5rem;   /* 增大 → 按钮上移，减小 → 按钮下移靠近火箭 */
3  right: 1.5rem;    /* 增大 → 按钮左移，减小 → 按钮右移靠近边缘 */
4}

1.scroll-to-comment {
2  width: 40px;
3  height: 40px;
4  bottom: 5.2rem;
5  right: 1rem;
6}