Question

HTML

<div id="ModeliSadrzajAir">
  <div class="kocka220x300">

  </div>
  <div class="kocka220x300">

  </div>
  <div class="kocka220x300">

  </div>
  <div class="kocka220x300">

  </div>
</div>

我有5个div，他们有css

#ModeliSadrzajAir
{
    width: 960px;
    margin: -60px 0px 30px -10px;
    min-height: 500px;
    z-index: 70;
    position: relative;
}

.kocka220x300
{
    border-radius: 5px;
    width: 220px;
    margin: 10px;
    height: 300px;
    float: left;
    -webkit-transition: all 0.4s ease-out;
    -moz-transition: all 0.4s ease-out;
    -ms-transition: all 0.4s ease-out;
    -o-transition: all 0.4s ease-out;
    transition: all 0.4s ease-out;
}

如果我转换第一个div宽度，则最后一个div按预期下降但它没有动画。如何将动画放在其他div上？

我在链接http://jsfiddle.net/hrvojeBarbaric/Xsjdh/1/

上有例子

Answer 1

基于一些研究，如果没有更广泛的JavaScript，我认为这是不可能的。从本质上讲，你必须定位元素＆＃34;绝对＆＃34;然后根据第一个元素的新宽度/高度确定其他元素所属的位置。最后，如果你把它放到另一个div中，你可以确保该div的高度和宽度在页面上向下移动其他元素。

有一些帮助程序库可以为您执行此操作。例如：

希望这会让你走上正轨。祝你好运！

用jquery动画div

1 个答案: