jquery展开和折叠

Question

我正在尝试复制Cloudania Citizens页面的效果，请点击此处：

http：// cloudania.com/citizens /

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

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

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

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来滑动切换content1，
2. 您需要将内容1中的所有7种不同内容作为绝对位置并隐藏/显示：无;
3. 然后在每个盒子上的Clcick你需要告诉它显示相关的隐藏div。
4. 如果单击另一行上的任何框，则需要滑动切换其他打开的内容1以关闭。

简单。

Answer 2

使用jquery很容易，使用slideDown（）来显示div：

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

并使用slideUp（）隐藏