Question

I’d like to use CSS’s :hover pseudo-class to control a drop-down on hover. That’s been accomplished. The tricky part, however, is animating that drop-down. I do not want to rely on jQuery to make the menu show up at all, it should work perfectly (albeit without the fade animation) with JS off. Is there a way to ‘hook’ into CSS’s :hover and instead run some jQuery (fade the menu in, and out on hover out), if JS is turned on?

Answer 1

very roughly, say you have <ul class="css-hovers">

then in jquery $('ul').removeClass('css-hovers').addClass('js-hovers');
– so the css and js hovers wont run at the same time ..

and add your jquery hovers:
$('ul.js-hovers').hover(function () { ... etc - see Darko Z's answer