WordPress.org

Ready to get started?Download WordPress

Forums

Image rollovers with Dynamic Menu Highlighting (2 posts)

  1. AUAN
    Member
    Posted 4 years ago #

    Hello all,

    I have been trying to add some image rollovers to a currently working dynamic menu I am using. So far I have tried techniques with both CSS and Javascript inorder to insert rollover/hover images but none of it seems to be working.

    If someone could have a look at my current code structure and suggest the best way possible integrate image rollovers on all the menu links that aren't active (the rollover would simply be the same as the active image).

    The blog: http://www.georgehajian.co.nz/wordpress/weblog

    Menu code

    <div id="nav">
        <ul class="menu">
    
         <li>
         <a href="<?php bloginfo('siteurl'); ?>">
         <img src="<?php bloginfo('stylesheet_directory'); ?><?php if (is_page('Home')) {echo "/images/buttons/home_active.jpg";}else echo "/images/buttons/home_inactive.jpg" ?>" width="88" height="24" alt="home"/></a>
         </a>
         </li>
    
         <li class="spacer">
         <a href="http://www.georgehajian.co.nz/wordpress/weblog">
         <img src="<?php bloginfo('stylesheet_directory'); ?><?php if (is_home()) {echo "/images/buttons/weblog_active.jpg";}else echo "/images/buttons/weblog_inactive.jpg" ?>" width="115" height="23" alt="weblog"/></a>
         </li>
     	 <li class="spacer">
         <a href="http://www.georgehajian.co.nz/wordpress/category/art">
         <img src="<?php bloginfo('stylesheet_directory'); ?><?php if (is_category('Art')) {echo "/images/buttons/art_active.jpg";}else echo "/images/buttons/art_inactive.jpg" ?>" height="23" alt="art"/></a></li>
         <li class="spacer">
         <a  href="http://www.georgehajian.co.nz/wordpress/resume"><img src="<?php bloginfo('stylesheet_directory'); ?><?php if (is_page('Resume')) {echo "/images/buttons/resume_active.jpg";}else echo "/images/buttons/resume_inactive.jpg" ?>" width="116" height="24" alt="resume"/></a>
         </li>
        </ul>
        </div>

    Many thanks.

  2. WebmistressM
    Member
    Posted 4 years ago #

    I too am unsure how to create image rollovers that work with the dynamic menus of a CMS such as WordPress.

    http://www.tutorio.com/tutorial/pure-css-image-rollovers

    This is one way I have done it in HTML format. How to adapt that to WordPress? NAVT plugin was a total wash.

Topic Closed

This topic has been closed to new replies.

About this Topic