我该怎么做 - 动画菜单

Question

这可能违反直截了当地提出要求的规则，但我在我的绳索末端！

请看这些图片。

点击左右时，我需要为子菜单设置动画。单击ABOUT时，我需要子菜单向下设置动画，然后再进行操作。

我可以使用什么Jquery？

希望这是有道理的。

谢谢

Answer 1

这只是伪代码，因为没有html可以使用：

$(document).ready(function() {
   $('.menu-container-selector').children('ul').children('li').click(function() {
      if ($(this).find('ul.sub-menu-ul').length > 0) {
        $(this).find('ul.sub-menu-ul').animate({'opacity':'1','top':'30px','left':'100px'});
    }
});

}）;

和jsfiddle。

Answer 2

以下是演示：http://jsfiddle.net/Yk8bR/1/

我使用悬停，而不是点击，但你可以改变它。

$('#menu ul li').hover(function(){
    $(this).find('ul').show(400);
},
function(){
    $(this).find('ul').hide(0);
});

HTML（不要忘记锚点）

<ul id="menu">
    <li>Home</li>
    <li>About
        <ul>
            <li>The Company</li>
            <li>The Team</li>
        </ul>
    </li>
    <li>Services</li>
</ul>

你会在演示中看到基本的CSS，我无法理解。