如何在鼠标悬停时更改父菜单和子菜单颜色 [英] how to change parent menu and submenu color on mouseover

问题描述

嗨.......



我想要更改所选菜单项的背景和字体颜色。我希望效果应该适用于父节点以及子节点即整个选定的路径。我的代码我可以更改背景图像但不能更改字体颜色。只有鼠标悬停菜单项。字体颜色仅适用于鼠标悬停在菜单项上。

我的css代码是

hi .......

I want change background and font color of selected menu items.I want effect should apply to parent as well child node i.e. entire selected path.with my code i am able change background images but not font color.only mouseover menu items .font color apply to only mouse over menu item .
my css code is

.Menu
{
  background: url('../Images/Menubg_New2.jpg') repeat;
}

.Menu ul
{
    /*background:#7795BD;*/ /* background:#999966;   */
   background: url('../Images/Menubg_New2.jpg');
   /* background-image:url('../Images/Menubg_New.jpg'),url('../Images/menubg1.jpg') ; */
    color: #FFFFFF;
}

.Menu ul li
{
   color: #FFFFFF;
   /* background:#999966;*/
    text-align:left;
    /* set width if needed.*/
    /*width:120px;*/
    background: url('../Images/Menubg_New2.jpg');
   /* background-image:url('../Images/Menubg_New.jpg'),url('../Images/menubg1.jpg') ; */

}

.Menu ul li a
{
    color: #FFFFFF;
    padding: 4px 2px 4px;
    padding-left: 8px !important;
    border: 1px solid white;
    border-bottom: 0;

    background: url('../Images/Menubg_New2.jpg');
   /* background-image:url('../Images/Menubg_New.jpg'),url('../Images/menubg1.jpg') ; */

}

.Menu ul li:hover
{
    /*background: #663300;*/
    /*background:#660033;*/
    background: url('../Images/menubg4.jpg') repeat;
}

.Menu ul li a:hover
{
    /*color: red;*/
   background: url('../Images/menubg4.jpg') repeat;
}

为它提供soln。

provide soln for it.

推荐答案

为此，您需要为每个菜单树提供自己的CSS类。或者你需要用jquery来做。你想要改变你没有与之交互的项目的css，纯CSS不会那样做。

For this to work, you need for each menu tree to have it's own CSS class. OR you need to do it with jquery. You want to change the css of an item you're not interacting with, pure CSS is not going to do that.

这篇关于如何在鼠标悬停时更改父菜单和子菜单颜色的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！