Bootstrap 3 tabs problem

I have Bootstrap 3 Tabs
but anchors that link in the same page but further down the page in Tabs Not function… This problem exist only inside the tabs
but a anchor link in the footer TOP go on the top of Html page (same page) OUTSIDE Tabs code - outside Tabs in footer go upper outside the Tabs in header… working OK

Why and how solve the problem inside Tabs… for anchors to work - same page ???

I doubt anybody will be able to answer that without seeing the code, @mymac1. Do you have a link to the page in question?

http://www.neagi.org/Volume-1.php . you can find TOC anchors links in each Tab when you scroll little

1 Like

Hi,

You have this JS for the tabs at the bottom of the page.

	$('#myTabs a').click(function (e) {
				e.preventDefault()
				$(this).tab('show')
	});

The e.preventDefault() will stop any anchors in each whole section reaching their destination.

I assume you just wanted to disable the anchors in the tab switcher code only which you can do by being more specific.

e.g.


	$('#myTabs .nav a').click(function (e) {
				e.preventDefault()
				$(this).tab('show')
	});

The fragment identifiers in each section should work now.

Note that you won’t be able to link directly into another tab as that would require some scripting to implement and I think it would be bad UI to jump into other tabs anyway.

1 Like

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.