Fade эффект OnClick (JQuery)

Question

Я это очень простой вкладками блок:

$('.tabbed-section .panel').hide(); 
$('.tabbed-section .panel:first').show(); 
$('.tabbed-section .tabs li:first').addClass('active'); 
$('.tabbed-section .tabs li a').click(function() { 
    $('.tabbed-section .tabs li').removeClass('active'); 
    $(this).parent().addClass('active'); 
    var currentTab = $(this).attr('href'); 
    var tab_id = $(this).attr('href'); 
    $(this).closest('#hero').attr('class', 'clear ' + tab_id.replace('#', '')); 
    $('.tabbed-section .panel').hide(); 
    $(currentTab).show(); 
    return false; 
}); 

.. он прекрасно работает, но я могу добавить к выцветанию эффект, когда активные изменения вкладки? Я думаю, что для него есть плагин (innerfade), но я хочу избежать использования другого плагина, если это возможно.

Кроме того, можно ли прессовать jQuery выше?

Благодарим за помощь!

Answer 1

Вместо

$('.tabbed-section .panel').hide(); 
$(currentTab).show(); 

сделать

$('.tabbed-section .panel').fadeOut(); 
$(currentTab).fadeIn(); 

?

Answer 2

Как насчет этого?

$('.tabbed-section') 
    .find('.panel').hide().end() 
    .find('.panel:first').show().end() 
    .find('.tabs li:first').addClass('active').end() 
    .find('.tabs li a').click(function() { 
    var el = $(this); 
    $('.tabbed-section .tabs li').removeClass('active'); 
    el.parent().addClass('active'); 
    var currentTab = el.attr('href'); 
    el.closest('#hero').attr('class', 'clear ' + currentTab.replace('#', '')); 
    $('.tabbed-section .panel').fadeOut('fast', function() { 
     $(currentTab).fadeIn('fast'); 
    }); 
    return false; 
    });