6

Angular JS 1.2 を使用して高さアニメーションを動作させようとしています。ここには、アイテムを閉じるためのアニメーションが機能するプランカーがあります。

http://plnkr.co/edit/YVtnXgjO3Evb6tz5DJOp?p=preview

重要なビットは、この CSS です。

.accordion-body {
  height: 100px;
  -webkit-transition: 0.5s linear all;
  transition: 0.5s linear all;
}
.accordion-body.ng-hide-add,
.animate-show.ng-hide-remove {
  display: block !important;
}

.accordion-body.ng-hide-add{
}

.accordion-body.ng-hide-remove{
}
.accordion-body.ng-hide {
  height:0;
}

しかし、アイテムを開くためにそれを機能させる方法がわかりません。私は明らかに頭がおかしいことをしています-何が欠けていますか?

4

1 に答える 1

11

次の CSS で動作するようになりました。

.accordion-body {
  height: 100px;
  -webkit-transition: 0.5s linear all;
  transition: 0.5s linear all;
}
.accordion-body.ng-hide-add,
.accordion-body.ng-hide-remove {
  display: block !important;
  height: 0px;
}

.accordion-body.ng-hide-remove.ng-hide-remove-active {
  height: 100px;
}
.accordion-body.ng-hide-add{
  height: 100px;
}
.accordion-body.ng-hide-add.ng-hide-add-active {
  height: 0;
}

クラス名を台無しにしただけです。

于 2013-12-11T21:23:44.450 に答える