[jQuery] Modify tabbed interface

[Aleksey]

Hello, everyone)

I've read a tutorial describing creating simple tabs:
http://www.sohtanaka.com/web-design/simple-tabs-w-css-jquery/
But I want to modify it, and cannot achieve the desired result, and
that result can be seen at one template:
http://themeforest.net/item/maven-portfolio-wordpress/49522?no_login=true
(Just click on 'Live Preview')

So, I want a content:
1. slideUp() and fadeOut() simultaneously
2. slideDown() and fadeIn() simultaneously

I found an interesting article about a subject:
http://www.learningjquery.com/2008/02/simple-effects-plugins
But still, as I said, I don't know how to do that.

The code I use now:
(function($) {
        $.fn.slideFadeToggle = function(speed, easing, callback) {
                return this.animate({
                     opacity: 'toggle',
                     height: 'toggle',
                }, speed, easing, callback);
        }
})(jQuery)

                        $(function() {
                                $('.tab-content').hide();
                                $('ul.tabs li:first').addClass('active');
                                $('.tab-content:first').show();

                                $('ul.tabs li a').click(function() {
                                        $("ul.tabs li").removeClass("active");
                                        $(this).parent().addClass('active');
                                        $('.tab-content').hide();
                                        var href = $(this).attr('href');
                                        $(href).slideFadeToggle('slow');
                                        return false;
                                });
                        });

Thank you very much, if you can help me))