WordPress.org

1. AMGCAT
   Member
   Posted 10 months ago #

   Hello there,

   Is that possible ? I am using a premium wp theme and would like to customize the menu bar so when you mouse over the menu-items they change to very small image.

   Reading the codex I find the function:

   <?php wp_page_menu( $args ); ?>

   I know I can not add classes to links generated by wp but there is a way via css or php?

   I can detect the menu.item number with Firebug so I asume that It can be done in .css and the right code in header.php

   Thanks for help!!

   Toni

2. esmi
   Theme Diva & Forum Moderator
   Posted 10 months ago #

   In theory, this should be possible using the a:hover class.

3. AMGCAT
   Member
   Posted 10 months ago #

   Thank you esmi. It could be something like creating a menu with the menu items and then some styling on the css but not getting to do it at all yet.

   [Code moderated as per the Forum Rules. Please use the pastebin]

   In the css it would be something like:

   #header .navigation .menu-item-29  a:hover {background: url('../images/menu/flying-away-icon.png') }
   #header .navigation .menu-item-33  a:hover {background: url('../images/menu/Cube-icon.png') }
   #header .navigation .menu-item-32  a:hover {background: url('img_navsprites_hover.gif') }
   #header .navigation .menu-item-30  a:hover {background: url('img_navsprites_hover.gif') }
   #header .navigation .menu-item-31  a:hover {background: url('img_navsprites_hover.gif') }

   Mixed maybe with:

   a { background: url(image_hover.gif); }
   a:link { background: url(image_default.gif); }
   a:hover,
   a:focus { background: url(image_hover.gif); }

   I don not really know If what I am asking is posible but just I am feeling very close to find the solution. Just need some extra help.

   Thank you

Reply

You must log in to post.