WordPress网站点击下滚按钮时出现意外水平滚动问题排查

• 检查点击事件的JS逻辑：打开浏览器开发者工具（F12），选中下滚按钮、社交图标这类触发问题的元素，在「Event Listeners」标签里排查click事件绑定的回调。重点看有没有错误使用window.scrollBy、scrollIntoView这类API时，不小心加了水平滚动的参数（比如inline: 'start'）。

• 定位页面横向溢出元素：页面能向右滚动，肯定是有元素宽度超出了视口。在控制台执行这段代码：

  document.querySelectorAll('*').forEach(el => {
    if(el.offsetWidth > window.innerWidth) console.log(el);
  })
  

  找出溢出的元素，调整它的width、max-width属性，或者给父元素添加overflow-x: hidden限制横向滚动。

• 排查主题/插件冲突：先禁用所有第三方插件，切换到WordPress默认主题（比如Twenty Twenty-Four）测试。如果问题消失，再逐个启用插件、换回原主题，定位到引发问题的具体组件，针对性修复或替换。

• 检查锚点链接的设置：如果下滚按钮是锚点链接（<a href="#xxx">），确认目标锚点的位置是否正常，有没有错误指向了带横向偏移的区域。

内容的提问来源于stack exchange，提问作者foo.doo