title: Weird flickering on simple animation on iOS with IonicFramework
body: <p>I'm getting familiar with IonicFramework and building really simple app.
  For now it has one button revealing panel (fading in, was experimenting with sliding in from the bottom too). It works fine on Androids but on iOS animation has strange flickering at the beginning (on both emulator and device). </p>
  
  <p>Basically my view looks as follows:</p>
  
  <pre><code>&lt;ion-content class="has-header" ng-controller="MainCtrl"&gt;
      &lt;div class="container"&gt;
        &lt;button class="btn btn__big centered primary" ng-click="toggleDetails()"&gt;toggle info&lt;/button&gt;
      &lt;/div&gt;
      &lt;div class="panel panel-animated primary ng-hide" ng-show="detailsVisible"&gt;
        Details here
      &lt;/div&gt;
    &lt;/ion-content&gt;
  </code></pre>
  
  <p>And css classes with animations I apply to ng-show</p>
  
  <pre><code>.panel {
    position: absolute;
    width: 100%;
    height: 40%;
    top: 60%;  
    padding: 1em;
  }
  
  .panel-animated {
    -webkit-animation: fadeIn 0.5s;
    -moz-animation: fadeIn 0.5s;
    animation: fadeIn 0.5s;
  }
  
  .panel-animated.ng-hide {
   -webkit-animation: fadeOut 0.5s;
   -moz-animation: fadeOut 0.5s;
    animation: fadeOut 0.5s;
  }
  </code></pre>
  
  <p>I'm not using any external libs to animate, just plain Ionic built-in animation classes.
  I created <a href="https://github.com/mostr/ionic-ios-animation-flicker" rel="nofollow">repository with complete, ready to run application</a> so you may want to check it.</p>
  
  <p>Also video showing flickering but as flash videos are crap there is only one recorded while there were many more of them actually <a href="http://screencast.com/t/Ydw3lnX8o" rel="nofollow">video here</a></p>