JQuery：如何设置addClass/removeClass选项卡菜单的动画？[JSFiddle]

JSFiddle：

我如何在上面的链接中使用这个菜单并设置类转换的动画，使它们滑动而不是开关

        $( 'ul.cola-tabs li' ).click( function() {

            var tabID = $( this ).attr( 'data-tab' );

            $( 'ul.cola-tabs li' ).removeClass( 'current cola-sel' );
            $( '.tab-content' ).removeClass( 'current' );
            $( this ).addClass( 'current cola-sel' );
            $( "#"+tabID ).addClass( 'current' );

        });

        $( 'ul.cola-tabs li' ).hover( function() {

            $( 'ul.cola-tabs li' ).removeClass( 'cola-sel' );
            $( this ).addClass( 'cola-sel' );

        }, function() {

            $( 'ul.cola-tabs li' ).removeClass( 'cola-sel' );
            $( 'ul.cola-tabs li.current' ).addClass( 'cola-sel' );

        });

---

CSS转换-在给定的时间范围内将高度从0%转换为100%-您真正想要的效果是什么？我希望它滑动。