Menu icon Foundation
Tabs can we style the url without #fntn

I'm wondering if we can manipulate the url within Foundation Tabs.
I have:

<dl class="tabs vertical" data-tab data-options="deep_linking:true; scroll_to_content:false;">
 <dd class="tab-title"><a class="arrow" href="#Ipsum">Ipsum</a></dd>
</dl>

by clicking the Link the url changes to
http://domain.com/xyz#fntd-Ipsum

can we just get
http://domain.com/xyz#Ipsum

so without the "fntd-"

FD Tabs URL

I'm wondering if we can manipulate the url within Foundation Tabs.
I have:

<dl class="tabs vertical" data-tab data-options="deep_linking:true; scroll_to_content:false;">
 <dd class="tab-title"><a class="arrow" href="#Ipsum">Ipsum</a></dd>
</dl>

by clicking the Link the url changes to
http://domain.com/xyz#fntd-Ipsum

can we just get
http://domain.com/xyz#Ipsum

so without the "fntd-"

This post has been closed. No new replies can be added.

Rafi Benkual over 4 years ago

Not sure where the fntd is coming from. Looking at the example, it doesn't have that: http://foundation.zurb.com/docs/components/tabs.html#tabs-deeplink-3

jm over 4 years ago

Rafi, i found out this happens only when we set:
scroll_to_content: false;

it does not when scroll_to_content: true;

is there any reason ?

Jeanie Chung over 4 years ago

Hey there-

You actually have the correct behavior going on. The scroll_to_content setting either adds the prefix of #fndtn to essentially prevent the tab from finding the anchor and moving the window position to the tag.

So if you have scroll_to_content false, you'll have the #fndtn hash in there and the tab click WILL NOT send you to the corresponding hash. If you have it set to true, there will be no #fndtn hash and the tab click WILL send you to the corresponding hash.

jm over 4 years ago

Thx a lot Jeanie, now i got it!