my jquery navbar does not appear in IE8
<p>I've been searching an answer for that for a bit and I'm not able to find an answer to my dilema. The problem is probably simple enough but i've been having a nightmare with it.</p>

<p>I have a navbar powered with jquery that changes the background image when you hover and click on it. Once the click action is done, there is a fade to display the other image and also hide one div and show the other.</p>

<p>The code works perfectly fine in Firefox and chrome but stupid IE display's only a grey bar. When you click somewhere on the bar though, the div change works so i'm not sure what is wrong there.</p>

<p>To view the page click <a href="http://www.cuisi-fit.com" rel="nofollow">here</a></p>

<p>Here's the code: </p>

<pre><code>            $(document).ready(function() {
            navigationPrimary();
            menuAction();

            $("#pagePlan").hide();
            $("#pagePortes").hide();
            $("#pageAutre").hide();

            function menuAction() {             
            $("#menu li.acceuil").click(function(){
                $("#main").show();
                $("#pagePlan").hide();
                $("#pagePortes").hide();
                $("#pageAutre").hide();
                $("#menu li.acceuil a").css("background-position","0px -100px");
                $("#menu li.plan a").css("background-position","-150px 0px");   
                $("#menu li.portes a").css("background-position","-300px 0px");
                $("#menu li.services a").css("background-position","-450px 0px");
                $("#header img.estim").show();
                return false;                       
            });


            $("#menu li.plan").click(function(){
                $("#main").hide();
                $("#pagePlan").show();
                $("#pagePortes").hide();
                $("#pageAutre").hide();
                $("#menu li.acceuil a").css("background-position","0px 0px");
                $("#menu li.plan a").css("background-position","-150px -100px");    
                $("#menu li.portes a").css("background-position","-300px 0px");
                $("#menu li.services a").css("background-position","-450px 0px");
                $("#header img.estim").hide();
                return false;                   
            });

            $("#menu li.portes").click(function(){
                $("#main").hide();
                $("#pagePlan").hide();
                $("#pagePortes").show();
                $("#pageAutre").hide();
                $("#menu li.acceuil a").css("background-position","0px 0px");
                $("#menu li.plan a").css("background-position","-150px 0px");   
                $("#menu li.portes a").css("background-position","-300px -100px");
                $("#menu li.services a").css("background-position","-450px 0px");
                $("#header img.estim").hide();      
                return false;                   
            });

            $("#menu li.services").click(function(){
                $("#main").hide();
                $("#pagePlan").hide();
                $("#pagePortes").hide();
                $("#pageAutre").show();
                $("#menu li.acceuil a").css("background-position","0px 0px");
                $("#menu li.plan a").css("background-position","-150px 0px");   
                $("#menu li.portes a").css("background-position","-300px 0px");
                $("#menu li.services a").css("background-position","-450px -100px");
                $("#header img.estim").hide();  
                return false;                       
            });
            }


        });

        function navigationPrimary() {
        $('#menu li').removeClass('hover');
        $('#menu li a')
            .css({ opacity: 1.0 })
            .mouseover(function() { 
                $(this).stop().animate({opacity: 0.0}, 300);
                })
            .mouseout(function() {
                $(this).stop().animate({opacity: 1.0}, 1000);
            });
        }
</code></pre>

<p>Thank you in advance</p>
