Wordpress Themes - WP Forum at BFA - How to use images for page menu items?

Page 2 of 2

Show 40 post(s) from this thread on one page

Wordpress Themes - WP Forum at BFA (http://forum.bytesforall.com/index.php)

- Page & Category Menu Bars (http://forum.bytesforall.com/forumdisplay.php?f=10)

- - How to use images for page menu items? (http://forum.bytesforall.com/showthread.php?t=14300)

mimi	Nov 19, 2011 04:32 AM

In case someone is interested, I didn't want to start a new thread.

Might be easier to explain the problem with a link.

Katmoody

Nov 23, 2011 08:12 AM

I was thinking about trying this with editing my menu and have the buttons ready to go - but have a question - is there a way to change the menu image upon hover/click. Larry was talking about replacing the image information in the menu builder section and I like that idea ... could I specify which image to use on click or on hover?

Thanks a bunch - when I have money you guys get first dibs, seriously!

juggledad

Nov 23, 2011 08:28 AM

here is an example that shows one image for the curent page and another image for what ever menu item you hover on.

HTML Code:

div#menu1 ul.rMenu li.current_page_item a:link, 

div#menu1 ul.rMenu li.current_page_item a:active, 

div#menu1 ul.rMenu li.current_page_item a:visited {

background: url(./wp-content/themes/atahualpa371/images/logo.png) repeat-x scroll left top transparent !important;

}



div#menu1 ul.rMenu li.current_page_item a:hover, 

div#menu1 ul.rMenu li a:hover {

background: url(./wp-content/themes/atahualpa371/images/logo.gif) repeat-x scroll left top transparent !important;

}

Katmoody

Nov 23, 2011 10:16 AM

Quote:

Originally Posted by juggledad (Post 76404)

here is an example that shows one image for the curent page and another image for what ever menu item you hover on.

HTML Code:

div#menu1 ul.rMenu li.current_page_item a:link, 

div#menu1 ul.rMenu li.current_page_item a:active, 

div#menu1 ul.rMenu li.current_page_item a:visited {

background: url(./wp-content/themes/atahualpa371/images/logo.png) repeat-x scroll left top transparent !important;

}



div#menu1 ul.rMenu li.current_page_item a:hover, 

div#menu1 ul.rMenu li a:hover {

background: url(./wp-content/themes/atahualpa371/images/logo.gif) repeat-x scroll left top transparent !important;

}

Thanks! That is kind of what I was thinking ... but if I have an image for each of the navigation menu buttons - would I have to specify them each separately via CSS?

You rock by the way! Thanks!

juggledad

Nov 23, 2011 12:43 PM

yes, you would have to use the unique class for each menu item

All times are GMT -6. The time now is 03:45 PM.

Page 2 of 2

Show 40 post(s) from this thread on one page