Fade effect onclick (jQuery)

Posted by Nimbuz on Stack Overflow See other posts from Stack Overflow or by Nimbuz
Published on 2010-01-04T11:59:25Z Indexed on 2010/05/01 20:07 UTC
Read the original article Hit count: 324

Filed under:
|
|
|
|

I have this very basic tabbed block:

$('.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;
});

.. it works great, but can I add fade effect when the active tab changes? I think there's a plugin (innerfade) for it but I want to avoid using another plugin if possible.

Also, can the jQuery above be compacted further?

Thanks for your help!

© Stack Overflow or respective owner

Related posts about jQuery

Related posts about fade