Question

我有这段代码：https://jsfiddle.net/og248ev0/

<div class="a"></div>
<div class="a"></div>

当顶部div淡出时，第二个div跳到上面的位置。（正如预期的那样）

我怎样才能使

由于

编辑：

我有另一个版本的文字：

https://jsfiddle.net/og248ev0/7/

这里的问题是第二项“跳跃”和动画因底部边缘而结束。

我能解决这个问题吗？

1 个答案:

答案 0 :(得分：5)

Answer 1

您可以<table id="ctl00_ContentPlaceHolder2_rblRework" class="form-control FormatRadioButtonList"> <tbody> <tr> <td> <input id="ctl00_ContentPlaceHolder2_rblRework_0" type="radio" name="ctl00$ContentPlaceHolder2$rblRework" value="Yes"> <label for="ctl00_ContentPlaceHolder2_rblRework_0">Yes</label> </td> <td> <input id="ctl00_ContentPlaceHolder2_rblRework_1" type="radio" name="ctl00$ContentPlaceHolder2$rblRework" value="No"> <label for="ctl00_ContentPlaceHolder2_rblRework_1">No</label> </td> <td> <input id="ctl00_ContentPlaceHolder2_rblRework_2" type="radio" name="ctl00$ContentPlaceHolder2$rblRework" value="Strip Dry Out"> <label for="ctl00_ContentPlaceHolder2_rblRework_2">Strip Dry Out</label> </td> </tr> </tbody>和animate()分别使用opacity。默认情况下，动画排队。所以第二个会在第一个之后起作用。

height

$('.a').eq(0)
  .animate({
    opacity: 0
  }, 1000)
  .animate({
      height: 0,
      marginBottom:0 //to get rid of the final jump because of margin
  }, 1000);

.a {
  width: 100px;
  height: 50px;
  background: red;
  margin-bottom: 10px;
}

Fiddle

Jquery一起淡化和缩放

1 个答案: