Less buggy show/hide for navigation

JavaScript
1 
$(".nav-main ul.fsNavLevel1 > li.fsNavParentPage").on("mouseenter",function() {
  var _self=this;
  $("#fsHeader").animate({
    "height":$("#fsHeader .fsBanner").height()
  },150);
  $("#fsHeader").animate({
    "height":$("#fsHeader .fsBanner").height()+$(_self).find(">.fsNavPageInfo").outerHeight()
  },150);
});

$(".nav-main ul.fsNavLevel1 > li.fsNavParentPage").on("mouseleave",function() {
  var _self=this;
  $("#fsHeader").animate({
    "height":$("#fsHeader .fsBanner").height()
  },150);
  $("#fsHeader").animate({
    "height":$("#fsHeader .fsBanner").height()-$(_self).find(">.fsNavPageInfo").outerHeight()
  },150);
});

htt p://s ac re dsf.fi nal site .co m/

I’m trying to push down the main page during the hover dropdown, but the show/hide is a bit buggy. Should be pretty obvious looking at it. Can someone jump in and let me know how you’d do this? Having some difficulty getting the JS to get the proper numbers, and not a JS height that’s still in transition :frowning: .

2

Wow, nevermind. I just need to remove this one and all appears to be good!

 $("#fsHeader").animate({
    "height":$("#fsHeader .fsBanner").height()-$(_self).find(">.fsNavPageInfo").outerHeight()
  },150);

If you’re reading this, still try it out though and let me know if it’s buggy at all for you! Please.

3

Would the transition be better if it were a bit longer Ryan? I’m getting a bit seasick watching it go up and down :slight_smile:

4

That’ll be for my designer to decide :slight_smile: .I know my designer is a fan of faster animations (200-300ms speed) so it’ll depend whether he concurs with this.

(My code is 150 because its 150+150 (300) for the entire thing when it’s all said and done).

I think I actually made it 200+200 after I made my previous post.

5

Obviously not subject to visually induced seizures

2 Likes
6

Well, his last day IS this Friday, so perhaps some sort of sabotage is going on here.

7

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.