Jumping instead of Scrolling

[aanbar]

Agency Pro Theme.

When you click on the button in the Home Top widget area, the screen will "jump" down to the Home Middle widget area. On the demo, there is a nice smooth scroll instead of an abrupt jump.

See it here:
http://www.anbarlab.org/

Click on the "Under Construction" button and watch it jump.

How can I remove the jump and make it the smooth scroll instead?

Thank you.

http://www.anbarlab.org/

[vividvilla]

To achieve smooth scrolling follow these steps

1. Add the following jQuery file to your child-theme-directory/js/ folder as smooth-scroll.js - https://gist.github.com/vividvilla/8341205/raw/1f97beb0b7c5d965996faef22baea61a4435e612/smooth-scroll.js

2. To enqueue the jQuery file, Add the following code to your functions.php file.

function add_smooth_scroll() {
  wp_register_script( 'smoothscroll', get_template_directory_uri() . '/js/smooth-scroll.js', array('jquery'), '1.0.0', true );
  wp_enqueue_script('smoothscroll');
}
add_action( 'wp_enqueue_scripts', 'add_smooth_scroll' ); 

3. FInally add the class .scroll to the button link like

<a href="#home-middle" class="button scroll">Under Construction</a>

Thats it.

---

Vivek R – @vividvilla
Genesis Child Theme Designer and Blogger at WPStuffs.
For affordable Genesis Child Theme design and Customization Contact me here

[aanbar]

Thank you so much Vivek.

I also received a response from the StudioPress help folks. Their email text is below.

"It looks like you have a responsive contact form plugin that is causing a script error on your site.

I would suggest temporarily deactivating that plugin and clear your browser cache to see if the problem goes away.

If you have any caching plugins installed or a CDN for your site, you would need to clear the cache for those as well.

If for some reason disabling that plugin doesn't work, then I would recommend repeating the above, but disable all plugins. Then reactivate them one at a time to see which one causes the problem to return."

De-activating the response contact form did the trick. And easier for me - a non-programmer - to implement.

Thanks. I'll keep these instructions handy as well.

[Author]

Posts