jquery slide color animation menu

jquery slide color animation menu

Hello people.


I try to create a menu, with Level1 in the menus, horizontal, when you  click on a link, the submenu will slide down. This works so far ...


Now I would like to create animations with jQuery color it so that the Level1 change the background color during hover ... That works well ... BUT, now I try in vain a usable code may resort that also the sliding submenu the same background color as in the menu takes Level1 .... i havent lok




The sliding submenu is in #panel
The panel slide code:

<script type="text/javascript">
$(document).ready(function(){

    $(".btn-slide").click(function(){
        $("#panel").slideToggle("slow");
        $(this).toggleClass("active"); return false;
    });
   
     
});
</script>

















The navigation structure is located in the # navbar ul li.
The animation be produced:

// Background color animation
        $(document).ready(function(){
                $(".first a").hover(function() {
                $(this).animate({ backgroundColor: "#00aadd" }, 600);
        },function() {
                 $(this).animate({ backgroundColor: "#303030" }, 400);
        });
 // font color animation
                $(".second a").hover(function() {
                $(this).animate({ color: "#00eeff" }, 400);
        },function() {
    $(this).animate({ color: "#FFFFFF" }, 500);
        });
    // Fun with Color. Differnt font color each time hover
    // Original code can be found http://davidwalsh.name/jquery-random-color-animate
       original = $('#navbar ul li').css('background-color');
    $('#navbar ul li').hover(function() { //mouseover
        var col = 'rgb(' + (Math.floor(Math.random() * 256)) + ',' + (Math.floor(Math.random() * 256)) + ',' + (Math.floor(Math.random() * 256)) + ')';
        $(this).animate({'backgroundColor': col}, 1000);
    },function() { //mouseout
        $(this).animate({'backgroundColor': original},500);
    });
     // Hover Color Does not change back to original   
    $('#navbar ul li').hover(function() { //mouseover
        var col = 'rgb(' + (Math.floor(Math.random() * 256)) + ',' + (Math.floor(Math.random() * 256)) + ',' + (Math.floor(Math.random() * 256)) + ')';
        $(this).animate({'backgroundColor': col},500);
    },function() { //mouseout
        $(this).animate({'backgroundColor': col},500);
    });

  });




































Had her idea? i was very happy


greeting