menu parent-child hover - stop animation - jquery

I have this example here: http://jsfiddle.net/QRChv/

Im trying to set it up so that when you hover over a child list item, its animation will start, but the parent doesnt invoke its .hover() function.

I开发者_StackOverflow中文版 dont know if this can be done, but is there a way to stop the parent from actually going through with its animation. So it wont actually do anything when its child list item is being hovered over.

I have a bunch of if statements setup for each list item, tried to keep it simple.

I've updated your code:

http://jsfiddle.net/QRChv/4/

You need to stop event propagation, i.e. by returning false from the handler.

You could also call .stopPropagation() yourself on the event object

What about adding a call to stopPropagation. Something like this:

http://jsfiddle.net/rcravens/QRChv/9/