$(function() {
                /* poziciya elementa <li>, kotoryi vyvoditsya v tekuschii moment */
                var current = 0;
                
                var loaded  = 0;
                for(var i = 1; i <5; ++i)
                    $('<img />').load(function(){
                        ++loaded;
                        if(loaded == 4){
                            $('#bg1,#bg2,#bg3,#bg4').mouseover(function(e){
                                
                                var $this = $(this);
                                /* esli kursor myshi nahoditsya nad tekuschim elementom, to nichego delat' ne nado */
                                if($this.parent().index() == current)
                                    return;

                                /* item - eto bg1 ili bg2 ili bg3, v zavisimosti ot togo, gde nahoditsya kursor myshi */
                                var item = e.target.id;




                                /*
                                Eto sloi podmenyu. Budem skryvat' tekuschii sloi,
                                esli kursor pomestili nad pervym elementom <li> ili
                                sdelan perehod s poslednego elementa,
                                zatem sloi doljen sdvinut'sya sleva->napravo,
                                ili sprava->nalevo v drugom sluchae
                                 */
                                 

                                if(item == 'bg1' || current == 3)
                                    $('#menu .sub'+parseInt(current+1)).stop().animate({backgroundPosition:"(-266px 0)"},300,function(){
                                        $(this).find('li').hide();
                                    });
                                else
                                    $('#menu .sub'+parseInt(current+1)).stop().animate({backgroundPosition:"(266px 0)"},300,function(){
                                        $(this).find('li').hide();
                                    });
                                
                                if(current == 3 && item == 'bg1')
                                    $('#menu .sub'+parseInt(current)).stop().animate({backgroundPosition:"(-266px 0)"},300,function(){
                                        $(this).find('li').hide();
                                    });
                                if(current == 0 && item == 'bg4')
                                    $('#menu .sub'+parseInt(current+3)).stop().animate({backgroundPosition:"(266px 0)"},300,function(){
                                        $(this).find('li').hide();
                                    });
                                
                                if(current == 2 && item == 'bg1')
                                    $('#menu .sub'+parseInt(current)).stop().animate({backgroundPosition:"(-266px 0)"},300,function(){
                                        $(this).find('li').hide();
                                    });
                                if(current == 0 && item == 'bg3')
                                    $('#menu .sub'+parseInt(current+2)).stop().animate({backgroundPosition:"(266px 0)"},300,function(){
                                        $(this).find('li').hide();
                                    });
                                
                                if(current == 3 && item == 'bg2')
                                    $('#menu .sub'+parseInt(current)).stop().animate({backgroundPosition:"(-266px 0)"},300,function(){
                                        $(this).find('li').hide();
                                    });
                                if(current == 1 && item == 'bg4')
                                    $('#menu .sub'+parseInt(current+2)).stop().animate({backgroundPosition:"(266px 0)"},300,function(){
                                        $(this).find('li').hide();
                                    });
                                
                                if(current == 1 && item == 'bg3')
                                    $('#menu .sub'+parseInt(current+1)).stop().animate({backgroundPosition:"(266px 0)"},300,function(){
                                        $(this).find('li').hide();
                                    });
                                if(current == 2 && item == 'bg2')
                                    $('#menu .sub'+parseInt(current+1)).stop().animate({backgroundPosition:"(-266px 0)"},300,function(){
                                        $(this).find('li').hide();
                                    });
                                    /* stop
                                    stop stop
                                    stop*/

                                if(item == 'bg1' || current == 3){
                                    /* esli kursor myshi pomestili nad pervym elementom <li> ili proizveli perevod s poslednego elementa,
                                    to izobrajenie doljno sdvinut'sya sleva->napravo */
                                    $('#menu > li').animate({backgroundPosition:"(-1064 0)"},0).removeClass('bg1 bg2 bg3 bg4').addClass(item);
                                    move(1,item);
                                }
                               
                                
                                if(current == 2 && item == 'bg2')
                                    /* esli kursor myshi pomestili nad pervym elementom <li> ili proizveli perevod s poslednego elementa,
                                    to izobrajenie doljno sdvinut'sya sleva->napravo */
                                    $('#menu > li').animate({backgroundPosition:"(-1064 0)"},0).removeClass('bg1 bg2 bg3 bg4').addClass(item);
                                    move(1,item);

                                if(item == 'bg4' || current == 0){
                                    /* esli kursor myshi pomestili nad pervym elementom <li> ili proizveli perevod s poslednego elementa,
                                    to izobrajenie doljno sdvinut'sya sleva->napravo */
                                    $('#menu > li').animate({backgroundPosition:"(+266px 0)"},0).removeClass('bg1 bg2 bg3 bg4').addClass(item);
                                    move(0,item);
                                }
                               
                                
                                if(item == 'bg3' && current == 1)
                                    /* esli kursor myshi pomestili nad pervym elementom <li> ili proizveli perevod s poslednego elementa,
                                    to izobrajenie doljno sdvinut'sya sleva->napravo */
                                    $('#menu > li').animate({backgroundPosition:"(+266px 0)"},0).removeClass('bg1 bg2 bg3 bg4').addClass(item);
                                    move(0,item);





                                /* Izmenyaem tekuschii element */
                                current = $this.parent().index();
                                
                                /* Teper' poyavlyaetsya sloi tekuschego elementa */
                               
                                $('#menu .sub'+parseInt(current+1)).stop().animate({backgroundPosition:"(0 0)"},300,function(){
                                    $(this).find('li').fadeIn();
                                });
                            });
                        }    
                    }).attr('src', '/image/menu/'+i+'.jpg');
                
                            
                /*
                dir:1 - peremeschenie sleva->napravo
                dir:0 - peremeschenie sprava->nalevo
                 */
                function move(dir,item){
                    if(dir){
                        $('#bg1').parent().stop().animate({backgroundPosition:"(0 0)"},200);
                        $('#bg2').parent().stop().animate({backgroundPosition:"(-266px 0)"},300);
                        $('#bg3').parent().stop().animate({backgroundPosition:"(-532px 0)"},400);
                        $('#bg4').parent().stop().animate({backgroundPosition:"(-798px 0)"},500,function(){
                            $('#menuWrapper').removeClass('bg1 bg2 bg3 bg4').addClass(item);
                        });
                    }
                    else{
                        $('#bg1').parent().stop().animate({backgroundPosition:"(0 0)"},500,function(){
                            $('#menuWrapper').removeClass('bg1 bg2 bg3 bg4').addClass(item);
                        });
                        $('#bg2').parent().stop().animate({backgroundPosition:"(-266px 0)"},400);
                        $('#bg3').parent().stop().animate({backgroundPosition:"(-532px 0)"},300);
                        $('#bg4').parent().stop().animate({backgroundPosition:"(-798px 0)"},200);
                    }
                }
            });