simple animated hover on menu

[sly]

Hi,

I’m trying to find a way to create a simple animated hover effect on a menu.

I simply want an arrow that points to the current page on the menu to slide across when you hover over another page.

A graphic example of what I’m trying to explain is here: http://www.sly-design.co.uk/menu/

I am not a heavyweight coder (yet) but am learning fast. Can anyone help?

Thanks,

Sly.

[DogsGhost]

#navigationIdName li a:hover {
list of properties for how ever you want to create the triangle
}

[sly]

Thanks, I’m going to use a png for the triangle, but don’t know where to start on how to animate it on hover.

[jhl]

http://plugins.jquery.com/project/lavalamp2

[Historical Forums User]

Hello @sly I could just give you the answer and code it for you in a few minutes, but what fun would that be! Surely you’d be happier if I were to link to a tutorial related to your problem. You could learn while you work! Great fun for everybody!

@jhl sent you in a direction related to your problem, but I have a feeling it didn’t help very much. See if you can learn from this tutorial, and apply that to your problem. Good luck!

http://net.tutsplus.com/tutorials/html-css-techniques/how-to-build-a-lava-lamp-style-navigation-menu/

[Author]

Posts