Smooth-Scroll from one page to another?

I don’t think it’s possible to achieve what you said. “switch to another page from the main menu” actually means:
Going to a specific url, like you type directly in address bar https://www.google.com/ and you go to google.com
It’s fixed behavior of modern browser.

Jeriff,

There is definitely a way to achieve this effect. I used a theme called “SingleKey” which has this functionality built into it, but now I am having trouble trying to duplicate the effect using your plugin (I’ve also tried Malihu’s “Scroll to id” plugin), because once directed away from the home-page, the “#id” links are unable to take you back!

Here is a working example that I achieved using SingleKey theme:
https://www.whiterockselfstorage.com

You will notice on that majority of the content scrolls on one page, the homepage, but you can successfully navigate away to the https://whiterockselfstorage.com/pay-online/ and back to the scrollable homepage.

Is there any way to achieve this using your plugin? Please, let me know!

This is the example of that I am using your “Easy Scroll” plugin on right now…

When I navigate away from the homepage to my projects pages under my “Sample of Properties,” my navigation menu, which uses the “#id” to find the DOM elements, is unable to go back and find the element on the homepage.

For example, when I navigate to https://intercityinvestments.com/project/shoppes-lovers/ I am unable to use any of the other menu-links in my top navigation bar. This seems like a pretty common type of set up, to use the one-page scrolling layout on the homepage, while still having other separate pages, so I was hoping you had a simple solution!

THANK YOU

https://demo.themevan.com/simplekey/ Are you referring to this theme ?

Hey @JeriffCheng –

Awesome plugin. I did a bit of modification of your plugin (before I saw this post) to achieve this effect. It’s actually pretty straightforward – it’s not perfect though, I’d like to land on the top of the page, then have a bit of a delay before starting the scroll. I tried a setTimeout before running the animation, but I suppose predictably the browser hits the anchor first, then the delay and then the animation kicks in to “fine tune” the positioning. So it didn’t really work and I removed.

Maybe you can do better?

This is what I did, lines 172-200 in index.php:

<script type="text/javascript">
				jQuery.noConflict();
				(function( $ ) {
					$(function() {
							if ( window.location.hash ) {
								var target = $(window.location.hash);
								if (target.length) {
								$('html,body').animate({
								scrollTop: target.offset().top - <?php if (get_option('essl_offset')!='') {echo get_option('essl_offset');} else {echo '20';} ?>
								},<?php if (get_option('essl_speed')!='') {echo get_option('essl_speed');} else {echo '900';} ?> ,'<?php echo  get_option('essl_easing','easeInQuint');?>');
								return false;
								}
							}
						// More code using $ as alias to jQuery
						$("a[href*=#]:not([href=#]):not([href^='#tab']):not([href^='#quicktab']):not([href^='#pane'])<?php if($essl_exclude_begin) echo $essl_exclude_begin; ?><?php if($essl_exclude_match) echo $essl_exclude_match; ?>").click(function() {
							if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') && location.hostname == this.hostname) {
								var target = $(this.hash);
								target = target.length ? target : $('[name=' + this.hash.slice(1) +']');
								if (target.length) {
								$('html,body').animate({
								scrollTop: target.offset().top - <?php if (get_option('essl_offset')!='') {echo get_option('essl_offset');} else {echo '20';} ?>
								},<?php if (get_option('essl_speed')!='') {echo get_option('essl_speed');} else {echo '900';} ?> ,'<?php echo  get_option('essl_easing','easeInQuint');?>');
								return false;
								}
							}
						});
					});
				})(jQuery);
			</script>

Actually the above works on page load, then breaks the internal scrolling once that page is loaded… so not really a fix. If I get more time I’ll take another stab.

Actually I dont really know, what I am posting as I dont know anything about coding, but here is something I found and maybe this way I can contribute.
Hopefully this is of any help for you.
https://stackoverflow.com/questions/9652944/jquery-page-scroll-to-different-page