Skip to content
View in the app

A better way to browse. Learn more.

Web Designer Forum

A full-screen app on your home screen with push notifications, badges and more.

To install this app on iOS and iPadOS
  1. Tap the Share icon in Safari
  2. Scroll the menu and tap Add to Home Screen.
  3. Tap Add in the top-right corner.
To install this app on Android
  1. Tap the 3-dot menu (⋮) in the top-right corner of the browser.
  2. Tap Add to Home screen or Install app.
  3. Confirm by tapping Install.

Jquery tab not working?

Featured Replies

looking in the tabs.js doesn't it need a class of 'tabs' and not an ID?

I think you need to set your ul to use a class of "tabs", rather than an ID.

 

The text is moving out of the right sidebar because .tab_content p has a width of 540px set on it.

 

Edit: Always in there first Zed!

Edited by Tristar Web Design

  • Author

I think you need to set your ul to use a class of "tabs", rather than an ID.

 

The text is moving out of the right sidebar because .tab_content p has a width of 540px set on it.

 

Edit: Always in there first Zed!

 

thanks i actually had

// Jquery Tabs

$(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

//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('slow'); //Fade in the active ID content
	return false;
});

});
$(document).ready(function() {

//When page loads...
$(".tab_content2").hide(); //Hide all content
$("ul.tabs2 li:first").addClass("active").show(); //Activate first tab
$(".tab_content2:first").show(); //Show first tab content

//On Click Event
$("ul.tabs2 li").click(function() {

	$("ul.tabs2 li").removeClass("active"); //Remove any "active" class
	$(this).addClass("active"); //Add "active" class to selected tab
	$(".tab_content2").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('slow'); //Fade in the active ID content
	return false;
});

});

 

 

replaced the .tabs with tab_links but there is a jeerk when i clik on tabs cant i have a smooth fading transition when i click tabs?

Create an account or sign in to comment

Account

Navigation

Search

Search

Configure browser push notifications

Chrome (Android)
  1. Tap the lock icon next to the address bar.
  2. Tap Permissions → Notifications.
  3. Adjust your preference.
Chrome (Desktop)
  1. Click the padlock icon in the address bar.
  2. Select Site settings.
  3. Find Notifications and adjust your preference.