Home/ Questions/Q 8429613
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-10T05:23:09+00:00

My Problem (Fiddle) My problem is that on my jquery animated dropdown menu, when

  • 0

My Problem (Fiddle)

My problem is that on my jquery animated dropdown menu, when you hover over the “Other” link, the sub menu does not appear. When using firefox to ‘Inspect Element’, I find height is animated, and the width appears to be alright, yet all I see is the left border.

I noticed that if I have that particular section display as a block, when you animate the first menu it is shown, but upon entering the unordered list, it disappears (ex). I imagine it is somehow related to this, but I can not figure out what is causing this.

Any incite into what I’m probably just overlooking would be great, and of course much appreciated.

Notes:

  • I have had this problem in Firefox, Chrome, Opera, and IE.
  • It’s designed such that it could work with only css. The the first .each is overriding default css hover behavior.
  • the empty span holds the arrow image.
  • only relevant code is posted. However, you may view my site here
  • If you have any tips on making something more efficient, always welcome.
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    http://jsfiddle.net/sailorob/4cdTV/5/

    I’ve removed your CSS for simplicity’s sake and simplified your functions by utilizing jQuery slideUp and slideDown, which essentially handle many of the css properties you were managing with your functions. From here, I think it would be fairly simple to work back in some of your CSS.

    When utilizing javascript/jQuery/animation on menus, I highly suggest using timers (setTimeout) for firing mouseenters and ‘leaves. This way, your menu is more forgiving when a user accidentally moves their mouse a few pixels out of the menu and it closes.

    • 0