Q

ngClass動畫失敗靶向子元素

2013-12-16 40 views 0 likes

0

時，我不明白，爲什麼這裏的動畫不工作： http://plnkr.co/edit/ulq1MQNDtY9cO2pcjdzF?p=preview ngClass動畫失敗靶向子元素

發生的事情是：

上添加類：從成長到0200px並且具有從red到blue的背景顏色轉換
刪除類：從200px縮減到0並且具有背景顏色轉換從到yellow

任何想法爲什麼？
謝謝。

2013-12-16 Francisc

A

回答

0

我認爲你說的動畫不起作用問題是你正在給'.heading'添加動畫，但是你只是在切換'.expanded'。

只有在添加類時纔會應用Css動畫，因此刪除類並添加類將激活動畫。

下面的代碼將修復烏爾動畫

<div class="container" ng-class="{expanded:isVisible}"> 
    <h1 ng-class="{heading:isVisible}">Hello Plunker!</h1> 
</div>

2013-12-16 19:12:10 allenhwkim

+0

我需要切換父類和有其他孩子的反應也是如此。普朗克是一個簡單的例子。 – Francisc

+0

此外，當添加或刪除父類時，CSS將在子元素上進行轉換。這是一個無法解決的問題。 – Francisc

相關問題

11. 用css動畫元素方向控制
12. 靶向組分
13. jQuery子元素循環動畫
14. UpdatePanel的腸子元素的動畫
15. jQuery元素動畫的孩子價值？
16. CSS3當動畫時忽略子元素
17. presentViewController：動畫：完成：失敗
18. jQuery的動畫（）失敗
19. CSS：SVG旋轉動畫失敗
20. AS 2.0，Greensock，動畫失敗
21. 優化動畫失敗
22. Eclipse「元素創建失敗」
23. C++元素訪問失敗？
24. sessionFactory bean失敗'persistence'元素
25. 動畫HTML畫布元素
26. 動畫元素jquery
27. 動畫DOM元素
28. AngularJS動畫元素
29. 動畫4中的子元素動畫4
30. 選擇一個元素並將動畫應用到子元素