Question

我在为手机创建顶级抽屉导航菜单时遇到问题。我正在寻找类似于Google+ iPhone应用中使用的导航菜单的内容。

点击后，我想让菜单滑动，然后用它推下页面的内容。

我还需要更改活动链接并添加活动类。然后，活动链接也显示在顶部菜单的顶部。

正如你所看到我在那里有大部分，但没有正常工作。

我正在使用或使用我发现的演示： http://www.jordanm.co.uk/lab/topdrawer

然而，我努力让它像上面的链接一样工作。我想尽可能使用CSS3过渡来避免jQuery（如果可能的话）。

<nav>
  <ul class="nav nav-tabs nav-stacked">
    <li class="active"><a href="#">Products</a></li><!-- active link changes -->
    <li><a href="#">Information</a></li>
    <li><a href="#">History</a></li>
    <li><a href="#">Services</a></li>
    <li><a href="#">Orders Complete</a></li>
  </ul>
</nav>

希望有人能提供帮助，

由于

Answer 1

加入

 $('.menu').click(function(e){
    $('.drawer').toggleClass('active');
    e.preventDefault();
 });

http://jsfiddle.net/RFpDJ/1/

顶部抽屉导航菜单切换推送内容并显示活动链接

1 个答案: