0

我正在尝试复制 Cloudania Citizens 页面的效果，可在此处找到：

http://cloudania.com/citizens/

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

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

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

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

然后单击框 1，然后它看起来像：

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

谢谢你的帮助

4

2 回答 2

6

我知道访问 Jquery 的网站真的很无聊，但是你工作越简单越好。尝试使用滑动切换和良好的 css，您可以轻松实现这一点。可以在此处找到有关幻灯片切换的更多信息：http: //api.jquery.com/slideToggle/。

  1. 您需要让每个框都单击以滑动切换内容1，
  2. 您需要将内容 1 中的所有 7 个不同内容作为绝对位置并隐藏/显示：无；
  3. 然后还需要在每个盒子 onClcick 上告诉它显示相关的隐藏 div。
  4. 如果单击另一行上的任何框，则需要滑动切换其他打开的内容1 以关闭。

简单的。

于 2012-05-07T07:39:40.450 回答
3

使用 jquery 很容易，使用 slideDown() 显示 div ：

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

和 slideUp() 隐藏

于 2012-05-07T07:29:01.487 回答