转换在css中不起作用

我正在创建一个下拉菜单。一切工作到目前为止。不起作用的一件事是下拉菜单出现时不透明度的变化。我也想增加一个高度的流量。我的意思是整个高度应该在0.5秒后出现。转换在css中不起作用

现在我想我可能通过转换来实现这些事情，但不知何故它根本不工作。

#nav-primary ul ul{ 
    position:absolute; 
    left:0px; 
    opacity: 0; 
    transition:opacity .5s ease-in-out; 
    -webkit-transition: opacity .5s ease-in-out; 
    -moz-transition: opacity .5s ease-in-out; 
    -o-transition: opacity .5s ease-in-out; 
    z-index:497; 
} 

#nav-primary ul li:hover > ul { 
    opacity: 1; 
    position:absolute; 
    top:100%; 
    left:0; 
}

基本上我现在用的是wp_nav_menu从WordPress的：

wp_nav_menu(array('theme_location' => 'menu', 
        'link_before' => '<span>', 
        'link_after' => '</span>',));

结构应如下：

ul ...       // main-menu 
    li ... 
     ul ...     // sub-menu 
      li ... 
       <a> 
       <span> 
       </a>

来源

2013-02-01 Miss Marple

你有'ul ul'的过渡，但'：hover'发生在'li' – ashley

感谢评论。我现在改变了它。现在不透明度不会改变。下拉菜单保持透明。这是为什么？ –

你能提供你的HTML，所以我可以看到你的设置或看看这个网站'http：//www.greywyvern.com/？post = 337'，它有一些下拉菜单淡入 – ashley

在你的CSS代码，你永远不适用任何定位顶端最父母的ul元素。也许这是一个错字？

你的第一行是：

#nav-primary ul ul{

，但也许你的意思是：

#nav-primary ul {

你最好的第一步是建立你的父母UL认证。如果没有在你父母的ul和li上定位属性，你的孩子li就不会知道他们的定位。

假设你已经制定一些其他的默认样式，这样的事情是你将需要：

#nav-primary ul { 
    position:relative; 
}

再加上一些你已经有了，和其他一些基本的款式，而你对你的方式：

ul { 
    list-style: none; 
    margin: 0; 
    padding: 0; 
} 

li { 
    display: block; 
    width: 300px; 
    height: 30px; 
    line-height: 30px; 
    color: black; 
    padding: 5px; 
    background: #aaa; 
} 

ul li li { 
    background: #ccc; 
} 

#nav-primary ul { 
    position:relative; 
} 

#nav-primary ul > li > ul { 
    display: block; 
    position: absolute; 
    top: 100%; 
    left: 0; 
    transition:opacity .5s ease-in-out; 
    -webkit-transition: all .5s ease-in-out; 
    -moz-transition: all .5s ease-in-out; 
    -o-transition: all .5s ease-in-out; 
    opacity: 0; 
} 

#nav-primary ul > li:hover > ul { 
    opacity: 1; 
}

看到它在这里的行动：http://jsfiddle.net/jonthomas/27Ymw/1/

希望帮助！

来源

2013-02-02 06:47:42 jthomas

转换在css中不起作用

回答

相关问题