如何停用Elementor平滑滚动？WordPress单页锚点跳转需求

Got it! Since you're using Elementor to build your WordPress one-page site, there are a few straightforward ways to ditch that smooth scroll and make your "Contact" menu jump directly to its target section instead of scrolling slowly. Let’s walk through your options:

Option 1: Disable Smooth Scroll Directly in Elementor Settings (Easiest!) #

Elementor actually has a built-in toggle for this—no code required:

• Open the Elementor editor, click the hamburger menu in the top-left corner → Select Site Settings
• Look for the Scroll Behavior option (it might live under the General or Advanced tab, depending on your Elementor version)
• Toggle off the Smooth Scroll switch, then save your settings.

This is the recommended first step because it’s official and doesn’t require adding custom code.

Option 2: Override with jQuery #

If the built-in setting doesn’t work or you need more control, use jQuery to bypass Elementor’s smooth scroll script:
Add this code to your theme’s functions.php (use a child theme to avoid losing changes on theme updates), or insert it via Elementor’s Custom Code module (Pro feature) / a custom HTML widget in your footer:

jQuery(document).ready(function($) {
  // Unbind Elementor's default smooth scroll event
  $('a[href^="#"]').off('click.scroll');
  
  // Bind a new click event for instant jumps
  $('a[href^="#"]').on('click', function(e) {
    const target = $(this.getAttribute('href'));
    if (target.length) {
      e.preventDefault();
      // Jump directly to the target without animation
      window.scrollTo({
        top: target.offset().top,
        behavior: 'auto' // Critical for disabling smooth scroll
      });
      // Update the URL anchor to match (optional but improves UX)
      history.pushState(null, null, this.getAttribute('href'));
    }
  });
});

Note: This disables smooth scroll for all anchor links. If you only want to target the "Contact" menu, replace $('a[href^="#"]') with $('a[href="#your-contact-anchor-id"]') (swap in your actual anchor ID).

Option 3: Force Instant Scroll with CSS #

If JavaScript tweaks aren’t working, try overriding global scroll behavior with CSS:
Add this to your theme’s custom CSS (Appearance → Customize → Additional CSS):

html {
  scroll-behavior: auto !important;
}

This overrides any CSS-based smooth scrolling. If Elementor uses JavaScript for its smooth scroll, you’ll need to combine this with Option 2 for full effect.

内容的提问来源于stack exchange，提问作者Pollo.994