title: Wordpress; .current-menu-item to show hover state of image link
body: <p>So I have a nav bar that's using images instead of text, one image for it's normal state and another for it's hover state.</p>
  
  <p>In wordpress you can affect the menu item of the page you're currently on with the built in .current-menu-item class, this works nicely for text, but I can't seem to get it to work for images.</p>
  
  <p>When on a particular page, I'd like the associated menu item to show the image that's used in the hover state.</p>
  
  <p>Here's the link: <a href="http://ericbrockmanwebsites.com/dev4/" rel="nofollow">http://ericbrockmanwebsites.com/dev4/</a> and here's the code at a glance.</p>
  
  <p>CSS (I will be using a sprite once I get further in with production):</p>
  
  <pre><code> #access {
      display:block;
      float:left;
      margin:30px 0;
      padding:0;
      list-style:none;
    }
  
   #access li {
      display:block;
      float:left;
      margin:0 5px;
      padding:0;
      list-style:none;
    }
  
    #access .home a {
      display: block;
      background-image: url(images/nav-btn-home.png);
      background-repeat: no-repeat;
      width: 164px;
      height: 164px;
      text-indent: -9000px;
    }
  
    #access .home a:hover, #access .home .current-menu-item {
      display: block;
      background-image: url(images/nav-btn-home-hover.png);
      background-repeat: no-repeat;
      width: 164px;
      height: 164px;
      text-indent: -9000px;
    }
  
    #access .music a {
      display: block;
      background-image: url(images/nav-btn-music.png);
      background-repeat: no-repeat;
      width: 164px;
      height: 164px;
      text-indent: -9000px;
    }
  
    #access .music a:hover,   #access .music a:active {
      display: block;
      background-image: url(images/nav-btn-music-hover.png);
      background-repeat: no-repeat;
      width: 164px;
      height: 164px;
      text-indent: -9000px;
    }
  </code></pre>
  
  <p>Markup (using the WP built in custom menus):</p>
  
  <pre><code>&lt;nav id="access"&gt;
      &lt;?php wp_nav_menu( array( 'theme_location' =&gt; 'main-nav' ) ); ?&gt;
  &lt;/nav&gt; &lt;!-- access --&gt;
  </code></pre>
  
  <p>Advise or links to good articles that address the issue are much appreciated!</p>