var posicao;
var id;

$(document).ready(function() {

     $('.item').mouseover(function() {
        id = $(this).attr('id');
        // alert(posicao.left);
        $(this).stop().animate({
            'zIndex' : '555'
        }, 0, function() {
            $(this).animate({
                'left' : '0',
                'width' : '500'
            }, 500);
        });
    });

    $('.item').mouseout(function() {

        if(id == 'banner1') posicao = '0';
        if(id == 'banner2') posicao = '100';
        if(id == 'banner3') posicao = '200';
        if(id == 'banner4') posicao = '300';
        if(id == 'banner5') posicao = '400';

        $(this).stop().animate({
            'left' : ''+posicao+'',
            'width' : '100'
        },500,function() {
            $(this).animate({
                'zIndex' : '1'
            },0);
        });
    });

});


//$(document).ready(function(){
//     // $('.quadro > div').click(function() {
//     $('.quadro > div').mouseover(function() {
//        var index = $(this).index;
//        positionleft = $(this).position().left;
//        $(this).stop().animate({'width':'500px'}, 200, function() {
//            $('.quadro').stop().animate({'left' : '-'+positionleft+'px'}, 300);
//        });
//    })
//
//    $('.quadro').mouseout(function() {
//        $('.quadro').stop().animate({'left' : '0px'}, 200, function() {
//            $('.quadro > div').stop().animate({'width': '100px'}, 300);
//        });
//    });
//
//});