如何修改jQuery手风琴代码，实现激活标题滚动到窗口顶部

自定义手风琴场景 #

如果是你自己实现的手风琴展开逻辑，直接在点击回调里添加滚动代码即可：

// 原手风琴点击事件
$('.accordion-header').on('click', function() {
  // 你的原有展开/折叠逻辑（比如切换类、控制内容显示）
  $(this).toggleClass('active').next('.accordion-content').slideToggle();

  // 新增：平滑滚动到当前标题顶部
  $('html, body').animate({
    scrollTop: $(this).offset().top
  }, 300); // 300为动画时长，设为0则瞬间跳转
});

jQuery UI Accordion组件场景 #

如果用的是官方jQuery UI手风琴，利用其activate事件处理：

$( "#your-accordion-id" ).accordion({
  activate: function( event, ui ) {
    // 滚动到刚激活的标题
    $('html, body').animate({
      scrollTop: ui.newHeader.offset().top
    }, 300);
  }
});

注意事项 #

• 替换代码中的选择器（.accordion-header、#your-accordion-id）为你实际项目里的选择器
• 若页面有固定顶部导航，需减去导航高度：scrollTop: $(this).offset().top - $('.fixed-nav').height()

内容的提问来源于stack exchange，提问作者Dan H