Question

我需要创建具有过渡效果的菜单。这是菜单的链接。 http://files.www.gethifi.com/images/nicer-navigation-with-css-transitions/demo.html它与我的预期相同。但是在这个菜单中我们有父元素和子元素。我也想添加子子元素..我们需要做些什么改变..？帮助我..

Answer 1

你好，这是使用jQuery的答案：

HTML：

<li>
  <a href="#">Widgets</a>
  <ul>
    <li><a href="#">Im another menu</a></li>           
    <li><a href="#">Im another menu</a></li>
    <li><a href="#">Im another menu</a></li>
    <li><a href="#">Im another menu</a></li>
  </ul>
</li>

jQuery的：

$("#trans-nav").find("li").each(function(){
    //alert("hover");
    $(this).hover(function(){
        $(this).find("ul:first").attr('style','display:block');            
    });
});

CSS：

#trans-nav li ul li ul{
  display:none;
  position:absolute;
  top:0;
  left:8em;
  background: #63867f;
  width:8em;
}

#trans-nav li ul li ul li a {
  background: #63867f; 
 padding-right:0;
}

在这里查看jsfiddle的行动 - http://jsfiddle.net/6Xa8k/

在菜单中添加子项

1 个答案: