Trying to animate dropdown's opacity with jQuery, failing

[SamA74]

Take a look at this topic:-

CSS Hover Transition

Hi folks, I want to add a delay to a mouse hover on a sub menu but for some reason I cannot get the transition to work. When I hover over the LI the UL within it should only show after a couple of seconds. Currently, when I hover over the LI it shows the UL instantly. ul.navbar-nav li ul { opacity: .5; transition: .5s all 5s } ul.navbar-nav li:hover ul{ opacity: 1; transition: .5s all 5s } Thanks in advance for any assistance!

@RyanReese

Sounds like you are showing it via display:none/display:block, in which case this will not work

The solution offered by @PaulOB is a slightly different effect, but could be adapted.