Hi :)
I'm working on my website, just to practice a bit with jquery.
I have a problem here:
http://www.andreavarnier.com/temp

menu code is like this

        <ul id="menu">
                <li id="here"><a href="index.html">Home</a></li>
                <li class="open_sub"><a href="#">Musica</a>
                        <ul class="sub">
                                <li><a href="audio.html">audio</a></li>
                                <li><a href="spartiti.html">spartiti</a></li>
                                <li><a href="lezioni.html">lezioni</a></li>
                        </ul>
                </li>
                <li class="open_sub"><a href="#">Andrea</a>
                        <ul class="sub">
                                <li><a 
href="curriculum.html">curriculum</a></li>
                                <li><a href="foto.html">foto</a></li>
                                <li><a href="video.html">video</a></li>
                        </ul>
                </li>
                <li><a href="guestbook/">Guestbook</a></li>
                <li><a href="links.html">Links</a></li>
                <li><a href="contatti.html">Contatti</a></li>
        </ul>

and the js I'm using is fairly simple:

$(document).ready(function(){
        $(".sub").css("display", "none");
        $(".open_sub").click(function(){
                var f = $(".open_sub").not(this);
                f.children("ul.sub:visible").slideUp();
                f.removeClass("active");
                var t = $(this);
                t.children("ul.sub").slideToggle();
                t.toggleClass("active");
        });
});

with Internet Explorer 7 the submenus do not disappear until the
slide() effect is over.
this means the <li>'s are overlapping each other.
is there a known workaround? I searched this mailing list but I didn't
find anything...
thank you in advance :)
andrea

Reply via email to