jQuery的展开和折叠

Question

我试图复制Cloudania公民页面的效果，在这里找到：

的http：// cloudania.com/citizens/

我只是在寻找它的基本点击图片时展开和折叠的效果。

我一直在使用jQuery-Collapse by webcloud，但我无法让图像保持内联。

所以我希望它看起来像这样在打开的页面

http://i.stack.imgur.com/Lva48.png

然后箱1点击，那么它看起来像：

http://i.stack.imgur.com/SSAfV.png

感谢您的帮助

Answer 1

我知道去jQuery的网站是很无聊，但你的工作越简单越好。尝试使用滑动切换和一个很好的CSS，你可以很容易地实现这一点。更多信息滑动切换可以在这里找到：http://api.jquery.com/slideToggle/。

1. 你需要在每个箱子的onClick滑动，切换内容1，
2. 您必须内容1的绝对位置的所有7项不同的内容和隐藏/ dispaly：无;
3. 然后在每个盒子onClcick上，你需要告诉它显示相关的隐藏div。
4. 如果点击了另一行上的任何方框，则需要滑动切换其他打开的content1以关闭。

简单。

Answer 2

这很容易与jQuery的，使用slideDown（）来显示一个div：

http://api.jquery.com/slideDown/

而且效果基本show（）隐藏