hello,
I am working on menu tab and trying to make some changes in assets/templates/modxhost/modxmenu.css file. When a menu item is clicked, i want it to change its background image ( to indicate that a particular menu is clicked ), so i tried with the following code:-
#ajaxmenu ul li.category:active {
color: #fff;
background-image: url(images/menu_s_bg.gif);
background-repeat: repeat-x;
} and when the menu item is clicked, it doesn’t retain its background-image. Please help me out in this regard. Thanks in advance.
-
☆ A M B ☆
- 2,213 Posts
:visited will change the background after you click the link, but that setting remains if you click another link.
You may be able to accomplish your goal using javascript, but I wouldn’t know where to tell you to start on that approach.
AMDbuilder
I tried with the following code:
#ajaxmenu ul li.category:visited {
background-image: url(images/menu_s_bg.gif);
background-repeat: repeat-x;
}
But nothing is happening and when tried with this one below:
#ajaxmenu ul li.category a:visited {
background-image: url(images/menu_s_bg.gif);
background-repeat: repeat-x;
}
and the image will be set for the whole menu tab.
-
☆ A M B ☆
- 2,213 Posts
That’s likely correct, using a:visited tells the browser if they have visited a link to use this styling, but the drawback is that it applies to all pages visited so as they browse the site it applies to all the menu items as the browse.
I can’t think of another method at the moment outside of javascript, but I can’t help you there.
AMDbuilder
Could someone tell me what’s the starting point using javascript? ( i mean how do we actually start coding using javascript?)
