Slide down effect and delay on mega menu

How To
1

I have added a mega menu to my site here.

I would like to achieve the following:

  • the menu to slide down, instead of just appearing.
  • for there to be a slight delay in the menu disappearing when the pointer leaves the nav div (as the menu can disappear when the user moves the pointer diagonally out to one of the outer nav items - instead of moving it down and left/right).

I’m assuming that I need some custom CSS code for this, but as I’m not too savvy with code, I’d be grateful for any pointers.

2

Can’t view the site. I’m getting SSL_ERROR_RX_RECORD_TOO_LONG in Firefox and ERR_SSL_PROTOCOL_ERROR in Chrome.

4

@glp Ah, the site works fine for me in Firefox and Chrome, so difficult to troubleshoot. Would you be able to check again? I googled the error messages and made a slight change to my SSL settings on the site.

6

Add a translateY effect to the mega menu .open state with a slide-in animation.

For example - Jam