2

I have the following code for sliding down my submenus,

$('#nav-menu > ul#nav > li').hover(function(){
    var $this = $(this);    
    $this.siblings('li').find('.subnav-hover').stop().slideUp(200 , function(){
            $this.children('.subnav-hover').stop().slideDown();   
    });
}, function(){
    $(this).children('.subnav-hover').stop().slideUp();
});

I use the above code for multiple sites and it works absolutely fine, but on the following site --> link here, it does't quite work smoothly.

If you hover over the tab "Deficiency" , multiple times , you will see that the 2nd or 3rd time the submenu ul does't come into full view , because the height is not calculated correctly. In earlier sites i noticed slideDown() had issues with the property transition or when a fixed height was given, but in this case i am unable to locate the problem , and i am not sure why my slidedown() is not working.

Alexander Solonik
  • 9,838
  • 18
  • 76
  • 174
  • i dont think the problem is with your code . you do the animation somewhere else. i did $('#nav-menu > ul#nav > li').off('hover') and the animation still happens – Amit Wagner Dec 04 '17 at 12:32
  • Possible duplicate of [Slide down animation from display:none to display:block?](https://stackoverflow.com/questions/24314687/slide-down-animation-from-displaynone-to-displayblock) – Pedram Dec 04 '17 at 12:33
  • @AmitWagner , thanks for the heads up !! – Alexander Solonik Dec 04 '17 at 12:58

0 Answers0