Title: Current category links
Last modified: August 30, 2016

---

# Current category links

 *  [andrewmanalo](https://wordpress.org/support/users/andrewmanalo/)
 * (@andrewmanalo)
 * [10 years, 10 months ago](https://wordpress.org/support/topic/current-category-links/)
 * I’ve been searching all over the net, trying to find an answer for this.
 * [http://goo.gl/Ceun8q](http://goo.gl/Ceun8q)
 * So, the tabs on this page are category based. Is there a way to make the tab 
   scroll over at the same time as the content category link?
 * I’m sorry if I don’t make sense ha. I added a link to a screenshot an image to
   give a better visual. So as you rollover the category button (not in the nav),
   it has the roll over effect on both the navigation and in the content area and
   vice versa, you roll over a category in the navigation, and it has the roll over
   effect in the content area.
 * So how can it have the hover effect whenever you hover over a certain category,
   and make it active throughout the site?
 * > [View post on imgur.com](https://imgur.com/gL34Fde)
 * Thank you

Viewing 1 replies (of 1 total)

 *  [CrouchingBruin](https://wordpress.org/support/users/crouchingbruin/)
 * (@crouchingbruin)
 * [10 years, 10 months ago](https://wordpress.org/support/topic/current-category-links/#post-6278180)
 * You could do it using jQuery:
 *     ```
       <script>
       jQuery(document).ready(function($){
   
       // This is the mouse event handler for the Inner Beauty menu item
       $( "#menu-item-6" )
         .mouseover(function() {
           $("#menu-item-6").addClass("cat-hovered");
           $(".cat-inner-beauty").addClass("cat-hovered");
         })
         .mouseout(function() {
           $("#menu-item-6").removeClass("cat-hovered");
           $(".cat-inner-beauty").removeClass("cat-hovered");
         });
   
       // This is the mouse event handler for the Inner Beauty category tags
       $( ".cat-inner-beauty" )
         .mouseover(function() {
           $(".cat-inner-beauty").addClass("cat-hovered");
           $("#menu-item-6").addClass("cat-hovered");
         })
         .mouseout(function() {
           $(".post-categories").removeClass("cat-hovered");
           $("#menu-item-6").removeClass("cat-hovered");
         });
   
       });
   
       </script>
       ```
   
 * You would add the script using a script plugin like [Header and Footer](http://wordpress.org/plugins/header-footer/).
   What the script does is add mouseover and mouseout event handlers to the Inner
   Beauty menu item and the Inner Beauty category tags. The event handlers either
   add the class **cat-hover** to the Inner Beauty elements when the mouse is hovered
   over one of them or removes the class when the mouse exits.
 * So all you have to do, now, is define the CSS for the **cat-hover** class using
   your theme’s custom CSS option or a CSS plugin:
 *     ```
       .cat-hover {
          background-color: #ea7bda;
          color: white;
       }
       ```
   

Viewing 1 replies (of 1 total)

The topic ‘Current category links’ is closed to new replies.

## Tags

 * [active](https://wordpress.org/support/topic-tag/active/)
 * [category](https://wordpress.org/support/topic-tag/category/)
 * [css](https://wordpress.org/support/topic-tag/css/)
 * [hover](https://wordpress.org/support/topic-tag/hover/)

 * 1 reply
 * 2 participants
 * Last reply from: [CrouchingBruin](https://wordpress.org/support/users/crouchingbruin/)
 * Last activity: [10 years, 10 months ago](https://wordpress.org/support/topic/current-category-links/#post-6278180)
 * Status: not resolved

## Topics

### Topics with no replies

### Non-support topics

### Resolved topics

### Unresolved topics

### All topics