I have an issue with svg groups and basic animation. this guy is a button. When hovered over, out pops a sort of menu. The goal is that the menu retracts when the mouse pointer leaves the button and the menu.
The trouble starts with 'onmouseout'; even though button & menu are grouped, and with 'onmouseout' acting on the whole group, the mouseout action is triggered by mousing out ANY element within the group. So a move from button to menu triggers the retraction.
To work around this I've put a mask over the top that appears (so to speak - it does become visible but has 0 opacity, so cannot be seen), when the button is moused over. I've turned it grey here so you can see it. But if i want to add element onto this menu, I'm no further forward than before. The red block is this other element.
Seemingly, if I had the menu just appear instead of using animations to make them appear, the groups would behave as I want them to.
I hope someone can help or shed some light.
