Navigation

  • davy_yg

    (@davy_yg)


    12 years, 2 months ago

    I would like a grey box with reverse gradient background on hover and press for each menu item. How to do that ? I can create the image, but how to integrate them to the navigation in wordpress?

    header.php

    <ul id="navH">
   <div id="body">

 <li><img src="<?php echo get_stylesheet_directory_uri(); ?>/images/navline.png" /><?php wp_list_pages('sort_column=menu_order&title_li=&link_after=<img src="<?php echo get_stylesheet_directory_uri(); ?>/images/navline.png" alt="" />');?></li>	        

        <div id="search"><?php include('search.php'); ?></div>
     </div>
    </ul>

    web link

Viewing 1 replies (of 1 total)
  • BrianWK

    (@brianwk)

    12 years, 2 months ago

    you are going to want to add a background image link to your style.css file. the target is going to be something like

    #nav ul li a:hover {
    background-image:url('your_hover_pic_url.png');
    background-repeat:none;
}
#nav ul li a:active {
    background-image:url('your_active_pic_url.png');
    background-repeat:none;
}

    Without a url it is hard to know exactly what the css syntax would be. You may want to read up on pseudo classes, they can be a pain and they have to be used in the proper order in your style.css file.

Viewing 1 replies (of 1 total)
  • The topic ‘Navigation’ is closed to new replies.