tabify

HTML

<div class="header"></div>
<ul class="tabify" style="bottom:60px; z-index:99">
    <li>Test Account</li>
    <li>Inkasso</li>
    <li>Mindeggggrsaldo</li>
    <li>Some Tag</li>
    <li>Internal Account</li>
</ul>


<ul class="tabify" style="bottom:-100px; z-index:99">
    <li>Test Account</li>
    <li>Inkasso</li>
    <li>Mindersaldo</li>
    <li>Some Tag</li>
    <li>Internal Account</li>
</ul>

CSS

body {
    margin:0px;
    padding:0px;
}
.header {
    background: #e5e5e5;
    width: 100%;
    height: 100px;
    z-index: 100;
    position: relative;
    border-bottom: solid 1px;
}

JavaScript

$('.tabify').each(function () {
    var li_space = 0;
    $(this).css({
        'list-style': 'none',
        'padding': '0px',
        'position': 'relative'
    }).children('li').css({
        'font-weight':'bold',
        'font-family':'arial',
        'font-size':'12px',
        'display':'inline-block',
        'padding':'50px 10px 10px',
        'cursor':'pointer',
        'position':'absolute',
        'min-width':'120px',
        'background-color':'yellow',
        '-webkit-box-shadow':'rgb(0, 0, 0) 0px 0px 5px inset',
        'box-shadow':'rgba(0, 0, 0, 0.5) 0px 0px 15px inset',
        'border-radius':'10px'
    });
    $('li', this).each(function(){
        li_space = li_space + 50;
        $(this).css('z-index', '2');
        $(this).animate({
            'left': li_space
        }, 200).hover(function(){
            $(this).animate({
                'top':'25px'
            }, {duration: 100, queue: false});
        },function(){
            $(this).animate({
                'top':'0px'
            }, {duration: 200, queue: false});
        });
    });
});

$('.tabify li').click(function(){
    $parent = $(this).parent();
    $('.tabify li').removeAttr('class');
    $(this).attr('class', 'activeFlag');
    li_space = 0;
    $parent.children('li').each(function(){
        if( $(this).hasClass('activeFlag') ){
            $(this).animate({
                'left': $($parent).children('li:last').css('left')
            }, {duration: 100, queue: true}, function(){
                $(this).css('z-index','3');
            }).detach().appendTo($parent);
        }
        else{
            li_space = li_space + 50;
            $(this).css('z-index', '2');
            $(this).animate({
                'left': li_space
            }, {duration: 200, queue: true});
        }
    });
});