WordPress.org

Ready to get started?Download WordPress

Forums

Navigation and Subnavigation adaption (1 post)

  1. kasimpasa
    Member
    Posted 5 years ago #

    Hey folks!
    My question relates to the following problems. I want my navigation into account the following 2 points, or implements.

    1. Each navigation item consists of 2 images, follow the images in my css-file is. For Navigation:

    #nav01 a {background: url(images/navi/home_off.gif) top left no-repeat; width: 63px; height: 18px;}
    #nav01 a:hover {background: url(images/navi/home_on.gif) top left no-repeat;}
    #nav01 a.on, a:hover.on {background: url(images/navi/home_on.gif) top left no-repeat; width: 63px; height: 18px;}

    This would be like the CSS code for the image of the start/frontpage.

    However, if i wish, that it´s changes in an "active" field (example: if i click on the startpage the Home button, i want that the image changes from nav01 to nav01on) and the inactive fields remain the same, it doesnt happens. I have already try everythink bu i dont get this out.

    <ul>
          <li id="nav01"><a href="<?php bloginfo('home'); ?>"><span>Home</span></a></li>
          <li id="nav02"><a href="<?php bloginfo('url'); ?>/about"><span>About</span></a></li>
          <li id="nav03"><a href="<?php bloginfo('url'); ?>/multimedia"><span>Multimedia</span></a></li>
          <li id="nav04"><a href="<?php bloginfo('url'); ?>/forum"><span>Forum</span></a></li>
          <li id="nav05"><a href="<?php bloginfo('url'); ?>/kontakt"><span>Kontakt</span></a></li>
          <li id="nav06"><a href="<?php bloginfo('url'); ?>/impressum"><span>Impressum</span></a></li>
    </ul>

    2. Each SubNavigation consists of 2 images, follow the images in my css-file is. For Sub-Navigation:

    #subnav01 a {background: url(images/subnavi/sub1_off.gif) top left no-repeat; width: 64px; height: 11px;}
    #subnav01 a:hover {background: url(images/subnavi/sub1_on.gif) top left no-repeat;}
    #subnav01 a.on, a:hover.on {background: url(images/subnavi/sub1_on.gif) top left no-repeat; width: 64px; height: 11px;}

    Here again the same principle, change when active the rest stays the same until it is activated.

    <ul>
            <li id="subnav01"><a href="<?php bloginfo('url'); ?>/about/me"><span>About Me</span></a></li>
            <li id="subnav02"><a href="<?php bloginfo('url'); ?>/about/you"><span>About You</span></a></li>
            <li id="subnav03"><a href="<?php bloginfo('url'); ?>/about/us"><span>About Us</span></a></li>
            <li id="subnav04"><a href="<?php bloginfo('url'); ?>/about/about"><span>About About</span></a></li>
    </ul>

    3. Furthermore, the SubNavigation only be displayed if the navigation item i.e ABOUT has been selected.

    Big thanks in advance for your help. Greets, Kasimpasa

Topic Closed

This topic has been closed to new replies.

About this Topic

Tags

No tags yet.