Thank you. I like to use one library and not import all sorts of plugins if can be made with simple jquery.

Tested in IE6 working perfect.
Cheers !

[wags finger]

[ then gives thumbs up ]

Sorry to here your having problems. Sounds like a problem with the jquery. I’ve posted a revised tutorial for you. Have a look at the JQuery tabs with fade tutorial – hope this helps.

To fade the visible tab out and fade the new tab in you could adjust the jquery as follows.

$(document).ready(function(){
$(‘#tabs div’).hide(); // Hide all divs
$(‘#tabs div:first’).show(); // Show the first div
$(‘#tabs ul li:first’).addClass(‘active’); // Set the class of the first link to active
$(‘#tabs ul li a’).click(function(){ //When any link is clicked
$(‘#tabs ul li’).removeClass(‘active’); // Remove active class from all links
$(this).parent().addClass(‘active’); //Set clicked link class to active
var currentTab = $(this).attr(‘href’); // Set variable currentTab to value of href attribute of clicked link
$(“#tabs div:visible”).fadeOut(“slow”,function(){ //fade out visible div
$(currentTab).fadeIn(“slow”) //fade in target div
});return false;

});
});

In this example ‘return false;’ is used to disable the default action of the anchor tag. So the action of clicking on a link will run the jquery function but will not load the href attribute.

Whilst ‘return true;’ will allow the default action to process as normal.