Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums JavaScript Wonky menu behavior w/ pseudo classes

  • This topic is empty.
Viewing 1 post (of 1 total)
  • Author
    Posts
  • #158877
    modiophile
    Participant

    I’ve built a menu with several items in it, the first two “ENGINEERING” and “DEVELOPMENT” contain sub-menus that on hover are supposed to slideDown and on hover-out supposed to slideUp.

    <script>
        $(document).ready(function(){
            $("nav ul.first-halve > li:first-of-type").hover(
                function(){
                    $('.sub-menu.eng').slideDown('medium');}, 
                function(){
                    $('.sub-menu.eng').slideUp('medium');}
            );
            $("nav ul.first-halve > li:nth-of-type(2)").hover(
                function(){
                    $('.sub-menu.dev').slideDown('medium');}, 
                function(){
                    $('.sub-menu.dev').slideUp('medium');}
            );    
        });
    </script>
    

    There is some weird behavior though; when I hover over the edges of some of the sub-menu items, like near the bottom of ENGINEERING > MECHANICAL, the sub-menu begins to open and close by itself without any mouse movement. See video of what I’m talking about, https://www.youtube.com/watch?v=W7zVacv8anQ

    Anybody know what’s up? Thanks!

Viewing 1 post (of 1 total)
  • The forum ‘JavaScript’ is closed to new topics and replies.