1

Multilevel基于 CSS 类构建一个简单的推送菜单,它没有 javascript 动画并且在 CSS 转换/转换上运行。除了切换 is-open 类之外,它在每个部分都可以正常工作。

  1. 当用户点击一个链接时,它应该首先删除 .is-open 类。然后添加它以激活动画。

  2. 如果我说在第二阶段将 .is-open 类更改为.addClass("foo");删除 .is-open 类并添加 .foo 类没有问题。所以我想知道这部分代码有什么问题。

你可以在这里找到代码http://jsbin.com/EjUQ/2/

在演示中,您会发现没有submenu加载任何内容的菜单。这是正确的行为。我遇到的问题是我希望在打开新菜单之前关闭菜单。所以删除.is-open类然后再次应用它。

例如

链接 1、4、7 没有子菜单,所以 open on 什么都没有click/touch,单击菜单按钮将提示没有任何反应。这是正确的行为。

链接 2,3,5,6 有子菜单,因此它在点击/触摸时打开,菜单按钮将切换菜单以打开/关闭。

希望有人可以指出我做错的方向。谢谢。

4

1 回答 1

1

您应该使用transitionend事件。这样您就可以在将“is-open”类添加回侧边栏和内容之前收听动画完成。前任:

sidebar.one('transitionend', function() {
    sidebar.addClass("is-open");
    content.addClass("is-open");
});

现在,我在这里所拥有的并不完美,但我相信它传达了这个概念:http: //jsbin.com/EjUQ/9

于 2013-08-21T18:32:13.570 回答