0

我正在询问有关特定问题的特定问题，但我不知道该怎么做，但想将其添加到我的网站。

1）当父 li 有一个孩子时，我希望该导航保持悬停，并在通过子元素时应用效果。现在，当我不再悬停在它上面时，当我希望父 li 在通过子导航时仍然具有悬停效果时，它将失去悬停效果并在子元素上应用悬停效果。

2）我不知道该怎么做的另一件事是当我将鼠标悬停在任何导航链接上时的过渡效果，当我悬停在和退出时它会产生淡入淡出效果。我该怎么做呢？

我试图这样做：

CSS：

#nav li:hover > ul{ /*display sub menus when hovered over*/
    left:0; /*show menu when hovered*/
    z-index:100; /*places the sub nav in frontier of all elements*/
    transition: all 2.4s ease-in-out -2s; /*transition: property duration timing-function delay;*/
    -moz-transition: all 2.4s ease-in-out -2s;
    -webkit-transition: all 2.4s ease-in-out -2s;
}

它带来了出乎意料但很酷的结果，即向右滑动子菜单。这不是我想要的，但没关系。我只是想应用其他两个功能，但不知道在哪里看。我的完整代码在这里：jsfiddle nav code

4

2 回答 2

3

显示演示过渡

#nav a:hover{ 
    transition: ease-in-out all .4s; 
    -moz-transition: ease-in-out all .4s;
    -webkit-transition: ease-in-out all .4s;
    background-color:#000000;
    color:#FFFE41;
    text-decoration:none;
    font-weight:bold;
}
于 2013-10-06T02:28:20.100 回答
0

我编辑了您的代码，将left属性更改为opacity并添加了一个transition. 看看：http: //jsfiddle.net/YfuDT/

关于你问题的第 1 部分，恐怕你不会用 css 来实现它，需要一些 javascript。

于 2013-10-06T02:26:25.760 回答