Avatar of solsticeint
solsticeint

asked on 

Can I anchor an individual tab

Is is possible to open a page that has jquery tabs on it and open right to that tab.  So if it is not the first tab, but say the third, in this one case that one would open.
JavaScriptWeb Development

Avatar of undefined
Last Comment
solsticeint
Avatar of Sudaraka Wijesinghe
Sudaraka Wijesinghe
Flag of Sri Lanka image

You need to use the selected option.
See http://jqueryui.com/demos/tabs/#option-selected
Avatar of leakim971
leakim971
Flag of Guadeloupe image

check the selected option : http://jqueryui.com/demos/tabs/#option-selected

// but say the third
$( ".selector" ).tabs({ selected: 2 }); // auto open the third tab
Avatar of solsticeint
solsticeint

ASKER

What if I wanted to open all 5 tabs, based on 5 different links off another page?
Avatar of leakim971
leakim971
Flag of Guadeloupe image

at the same time?
Avatar of solsticeint
solsticeint

ASKER

What I have is 5 different contact forms on a contact page.  Each in its own tab.  One for Sales, one for Services, General Information, Sales Representatives, one for International Distributors.  I would like to be able to directly link to the page and correct form tab throughout the site.  I have done this with anchors in the past and plain pages, but not with tabs.  
ASKER CERTIFIED SOLUTION
Avatar of leakim971
leakim971
Flag of Guadeloupe image

Blurred text
THIS SOLUTION IS ONLY AVAILABLE TO MEMBERS.
View this solution by signing up for a free trial.
Members can start a 7-Day free trial and enjoy unlimited access to the platform.
See Pricing Options
Start Free Trial
Avatar of solsticeint
solsticeint

ASKER

I have attached what I have so far.  I could use your thoughts on the best way to incorporate it.

Thank you
$(document).ready(function() {
		
			//When page loads...
			$(".tab_content").hide(); //Hide all content
			$("ul.tabs li:first").addClass("active").show(); //Activate first tab
			$(".tab_content:first").show(); //Show first tab content
			
			$(".inner-tab_content").hide(); //Hide all content
			$("ul.inner-tabs li:first").addClass("active").show(); //Activate first tab
			$(".inner-tab_content:first").show(); //Show first tab content
		
			//On Click Event
			$("ul.tabs li").click(function() {
		
				$("ul.tabs li").removeClass("active"); //Remove any "active" class
				$(this).addClass("active"); //Add "active" class to selected tab
				$(".tab_content").hide(); //Hide all tab content
		
				var activeTab = $(this).find("a").attr("href"); //Find the href attribute value to identify the active tab + content
				$(activeTab).fadeIn(); //Fade in the active ID content
				return false;
			});
		
			//On Click Event
			$("ul.inner-tabs li").click(function() {
		
				$("ul.inner-tabs li").removeClass("active"); //Remove any "active" class
				$(this).addClass("active"); //Add "active" class to selected tab
				$(".inner-tab_content").hide(); //Hide all tab content
		
				var activeTab = $(this).find("a").attr("href"); //Find the href attribute value to identify the active tab + content
				$(activeTab).fadeIn(); //Fade in the active ID content
				return false;
			});
		
		});
	</script>

Open in new window

JavaScript
JavaScript

JavaScript is a dynamic, object-based language commonly used for client-side scripting in web browsers. Recently, server side JavaScript frameworks have also emerged. JavaScript runs on nearly every operating system and in almost every mainstream web browser.

127K
Questions
--
Followers
--
Top Experts
Get a personalized solution from industry experts
Ask the experts
Read over 600 more reviews

TRUSTED BY

IBM logoIntel logoMicrosoft logoUbisoft logoSAP logo
Qualcomm logoCitrix Systems logoWorkday logoErnst & Young logo
High performer badgeUsers love us badge
LinkedIn logoFacebook logoX logoInstagram logoTikTok logoYouTube logo