Whenever the <code>ngMessages</code> directive contains one or more visible messages then the <code>.ng-active</code> CSS
class will be added to the element. The <code>.ng-inactive</code> CSS class will be applied when there are no
messages present. Therefore, CSS transitions and keyframes as well as JavaScript animations can
hook into the animations whenever these classes are added/removed.</p>
<p>Let&#39;s say that our HTML code for our messages container looks like so:</p>
<pre><code class="lang-html">&l