Question

网址：http://test.getfamo.us/buy-twitter-followers.html

问题：这篇文章是关于下拉框的，它们目前已修复到位。我想它，所以它们直接在彼此之下，然后当你点击展开时，另一个被推下来。我该怎么做呢？

设置：每个框都是它自己的div（box1到box6），这是两个div（顶部和底部（对应的行），然后是一个about div。

CSS ：这是我使用的CSS：http://test.getfamo.us/css/screen.css

我相当确定应该有一种方法可以用更少的代码来完成它。但无论如何我更担心的是，当盒子展开时，下面的盒子向下移动。有问题的代码在“/ * ABOUT * /”下，所以如果你搜索它应该出现。

非常感谢您提供的任何帮助！（如果相关，则在jquery中扩展编码）

Answer 1

你在想手风琴吗？ FIDDLE

HTML

<div id="accordion">
  <h3>1,000 Followers - $4.99</h3>
  <div>
    <div><img src='http://www.ibcs-software.com/images/tick.png' /> Try us out now!</div>  
    <div><img src='http://www.ibcs-software.com/images/tick.png' /> 24 hour Delivery</div>  
    <div><img src='http://www.ibcs-software.com/images/tick.png' /> 24/7 Live Support</div>  
    <div><img src='http://www.ibcs-software.com/images/tick.png' /> Impress your followers</div>  
    <div><img src='http://www.clker.com/cliparts/b/a/L/8/a/Z/orange-cross-md.png' />Bulk Discount</div> 
  </div>
  <h3>5,000 Followers, $12.99</h3>
  <div>
    <div><img src='http://www.ibcs-software.com/images/tick.png' /> 24 hour Delivery</div>  
    <div><img src='http://www.ibcs-software.com/images/tick.png' /> Live Support</div>  
    <div><img src='http://www.ibcs-software.com/images/tick.png' /> Get recognized now!</div>  
    <div><img src='http://www.ibcs-software.com/images/tick.png' /> Money back guartantee</div>  
    <div><img src='http://www.ibcs-software.com/images/tick.png' /> Great value</div>  
  </div>
  <h3>25,000 Followers, $29.99</h3>
  <div>
    <div><img src='http://www.ibcs-software.com/images/tick.png' /> 24 hour Delivery</div>  
    <div><img src='http://www.ibcs-software.com/images/tick.png' /> Great for expanding business!</div>  
    <div><img src='http://www.ibcs-software.com/images/tick.png' /> Live Support</div>  
    <div><img src='http://www.ibcs-software.com/images/tick.png' /> Amazing Price</div>  
    <div><img src='http://www.ibcs-software.com/images/tick.png' /> Bulk Discount</div>  
  </div>   
  <h3>50,000 Followers, $49.99</h3>
  <div>
  <div>
    <div><img src='http://www.ibcs-software.com/images/tick.png' /> 24 hour Delivery</div>  
    <div><img src='http://www.ibcs-software.com/images/tick.png' /> Lifetime support</div>  
    <div><img src='http://www.ibcs-software.com/images/tick.png' /> Bulk discount</div>  
    <div><img src='http://www.ibcs-software.com/images/tick.png' /> Be famous on twitter</div>  
  </div>   
</div>

如何让盒子自动向下移动？

1 个答案: