Using Anchor

8 replies·opened Apr 18, 2021
O
ovetterApr 18, 2021

I use Anchor from side-menue and main-menue.
Anchor links are working well, if I use side-menue. If my current page is an anchor-page, then the link (absolute URL)
with ".../ccc/test.html#anchor" dosn't work. Therefore I use in main-menue redirect-pages ... then it wirks... BUT:
the called page is displayd on bottom of page. However, the page must be displayed at the top !.

Please help. Thanks.
O.Vetter

S
SemiColonWebSTAFFApr 18, 2021

Hello,

This is the Default behavior of the Browser and not due to Canvas codes. You can consider using the following code at the bottom of the Page to make your Page load at the Top:

<script>
	jQuery(document).ready( function(){
		setTimeout(function() {
			if (location.hash) {
				window.scrollTo(0, 0);
			}
		}, 1);
	});
</script>

This should definitely work fine. Hope this Helps!

Let us know if we can help you with anything else or if you find any further issues.

S
SemiColonWebSTAFFApr 19, 2021

Hello,

This unfortunately is not supported by default. You will need to use Custom JS Codes for this. Example:

<a href="#" onclick="jQuery( '#side-navigation' ).tabs( 'enable', '#anchor' );return false;"></a>

This should work fine. You will need to further customizations on this manually. Hope this Helps!

Let us know if we can help you with anything else or if you find any further issues.

S
SemiColonWebSTAFFApr 20, 2021

Hello,

If you are planning to change the URL in the Browser with the Hash URL of the Tab when clicking on it, then it is currently not supported.

Hope this Helps!

Let us know if we can help you with anything else or if you find any further issues.

O
ovetterApr 20, 2021

Hallo,
my question is: where I have tu integrate your example () ??

I have integrated inside the text with Linktext "Liniennetzplan". ---> this not works.
Or have I to integrate your example to side-menue ?

Thanks for help.

S
SemiColonWebSTAFFApr 22, 2021

Hello,

To activate a tab from another Link outside the Tab Links, you will need to use something like this:

<a href="#liniennetzplan" onclick="jQuery( '#side-navigation' ).tabs( 'option', 'active', 0 );return false;"> LINIENNETZPLAN</a>

This should work fine. You will need to further customizations on this manually. Hope this Helps!

Let us know if we can help you with anything else or if you find any further issues.

O
ovetterApr 23, 2021

Thank you. I works great!

O.Vetter

Have the same question, or something new?

Sign in to the Canvas dashboard to reply or open your own topic. Canvas owners get direct help from the SemiColonWeb team.

Reply on the dashboard