Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

WordPress

Posted by Christel Macabeo
Christel Macabeo
4,619 Points

hovering over a link and having a picture appear

I'm trying to develop a custom wordpress theme. I was wondering how I would be able to emulate the hover effect that adan did on his portfolio page, where if you hover over a menu item such as design, an image appears (such as an arrow pointing to it saying humble beginnings). How do I do this on wordpress?

http://iamadanh.com/

2 Answers

Ken Alger
STAFF
Ken Alger
Treehouse Teacher
Ken Alger
Ken Alger
Treehouse Teacher

Christel;

In looking at the code behind http://iamadanh.com/ his menu "doodles" are all done through CSS and assigning ids to the various nav elements, and then assigning properties to the hover state, for example:

nav.main a#home:hover{background:url(../images/menu_home.png) no-repeat; 

padding-top:50px;}

Does that help at all? I would think you could integrate that into a WordPress theme.

Happy coding,

Ken

Christel Macabeo
Christel Macabeo
4,619 Points
Christel Macabeo
Christel Macabeo
4,619 Points

Thanks Ken. Helps a lot!