$animateCssを使えばkeyfames構文のような形式でアニメーション定義出来るっぽいのでやってみた

要件としてはナビゲーションバーにリンクを設置、そこにマウスオーバーする事で出てくるUIを実現する。でその出てくる時にアニメーションして表示させる

コードは全部jsdo.itにあげてあるのでここで書くのは省略

要はリンクにng-mouseoverを設定してアニメーションでの表示を行って境界線となる所を外れるとng-mouseleaveが発生するようになって消えていくようなアニメーションを実現するような感じ