jquery - 切换导航侧边栏(CSS 和 JQuery)

Question

我需要一些帮助。我希望有一个侧边栏，可以在按下特定按钮时进行切换。侧边栏将显示，内容 div 的宽度将减小，以为侧边栏腾出空间。单击侧边栏按钮再次隐藏内容 div 后，内容 div 将重新变宽。我似乎根本无法让侧边栏工作。

http://jsfiddle.net/jhacks/P3Ckk/54/

我必须稍微改变一些东西才能让它很好地适应 fiddle 盒，不幸的是这似乎让事情变得更糟。例如，由于某种原因，使“内容”div 更宽会将其向下推？但我离题了......我想要解决的主要问题:

1. 当我单击“sidetoggleshow”按钮时，我什至无法显示侧边栏。我的 jquery 代码明显做错了什么？

2. 我不确定正确的解决方案是什么，当侧边栏隐藏时，让内容 div 展开以填充其容器 div 的剩余空间。但是，当侧边栏出现时，我希望内容被推过去。我的侧边栏在 html 中的定位可能是部分问题。目前，我将其设置为切换按钮的同级，因此它位于顶栏 div 内。但是，也许它一定是容器 div 的一部分？那么它会占用内容所在同一 div 内的空间吗？我会在 jquery 中引用什么？我想既然它是一个唯一的ID，那么我根本不需要任何“ sibling ”或“ child ”标签？再说一次，我确实尝试过这个，但它不起作用......再说一遍，它也不适用于兄弟方法

非常感谢任何和所有帮助。谢谢!

Answer 1

似乎您知道需要有两种状态，但您需要在 .click() 方法本身中区分它们，而不是注册两次单击处理程序。

我对代码片段进行了一些修改，编辑了 JS 和 CSS 代码并添加了注释，所以它应该是非常不言自明的。另外，我假设您希望默认情况下隐藏侧边栏。

http://jsfiddle.net/P3Ckk/78/

希望对你有帮助!