当我用鼠标向下滚动时，如何防止 WordPress 网站滞后？

Posted 2023-05-09

【中文标题】当我用鼠标向下滚动时，如何防止 WordPress 网站滞后？

【英文标题】：How can I prevent the WordPress website from lagging when I scroll down with the mouse?

【发布时间】：2021-12-23 02:46:48

【问题描述】：

3 年前，我使用 Spectrum Theme 为客户创建了一个 WordPress 网站。 我昨天查看了网站，发现有一个以前不存在的新行为 当我使用滚轮用鼠标向下滚动时，滚动是跳跃的。我有一个 JS 错误说 [Intervention] Unable to preventDefault inside passive event listener due to target being treated as passive 我试图将 touch-action: none 添加到 CSS 中，但什么也没发生。 我还尝试添加window.addEventListener("touchstart", func, passive: true ); 但不知道我是否在正确的地方做了。 我也尝试编辑 jquery.mousewheel.js 但我没有改变它。 我怎样才能让它再次顺利工作？ 这是网站 https://inwi-distribution.com/ 您必须使用鼠标滚轮滚动才能复制问题 提前谢谢你。

【问题讨论】：

请提供足够的代码，以便其他人更好地理解或重现问题。

欢迎。请查看How to Ask 并使用tour，然后修改您的帖子以提供更多信息。到其他地方的链接是不够的。

【参考方案1】：

将background-attachment: fixed;添加到下面提到的DIV（它属于您的主页旋转滑块代码区域）使您的网站滚动非常流畅：

<div class="tp-bgimg defaultimg " data-bgcolor="undefined" style="background-repeat: no-repeat;background-image: url(&quot;https://inwi-distribution.com/wp-content/uploads/2018/12/IQ0A3143-1.jpg&quot;);background-size: cover;background-position: center top;width: 100%;height: 100%;opacity: 1;visibility: inherit;z-index: 20;background-attachment: fixed;" src="https://inwi-distribution.com/wp-content/uploads/2018/12/IQ0A3143-1.jpg"></div>

此外，您将不得不使用 CSS 并为您的图像摆脱 position: absolute;。或者至少稍微重新定位图像，从而在图像上方添加不需要的空间。