javascript - Angular ng-enter leave flickers on Mozilla Firefox -
basically in latest chrome , ie views loaded without problems in mozilla firefox once click flickers halfloaded-css/js page disappears , correctly formed page appears.
<div style="position:relative"> <div style="width:100%" ng-view class="view"></div> </div>
css
.view.ng-leave { -webkit-animation-name: fadeoutup; -moz-animation-name: fadeoutup; -ms-animation-name: fadeoutup; -o-animation-name: fadeoutup; animation-name: fadeoutup; -webkit-animation-duration: 0.5s; -moz-animation-duration: 0.5s; -ms-animation-duration: 0.5s; -o-animation-duration: 0.5s; animation-duration: 0.5s; -webkit-animation-timing-function: ease; -moz-animation-timing-function: ease; -ms-animation-timing-function: ease; -o-animation-timing-function: ease; animation-timing-function: ease; -webkit-animation-fill-mode: both; -moz-animation-fill-mode: both; -ms-animation-fill-mode: both; -o-animation-fill-mode: both; animation-fill-mode: both; -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -ms-backface-visibility: hidden; -o-backface-visibility: hidden; backface-visibility: hidden; display: none; } .view.ng-enter { -webkit-animation-name: fadeindown; -moz-animation-name: fadeindown; -ms-animation-name: fadeindown; -o-animation-name: fadeindown; animation-name: fadeindown; -webkit-animation-duration: 1s; -moz-animation-duration: 1s; -ms-animation-duration: 1s; -o-animation-duration: 1s; animation-duration: 1s; -webkit-animation-delay: 1s; -moz-animation-delay: 1s; -ms-animation-delay: 1s; -o-animation-delay: 1s; animation-delay: 1s; -webkit-animation-timing-function: ease; -moz-animation-timing-function: ease; -ms-animation-timing-function: ease; -o-animation-timing-function: ease; animation-timing-function: ease; -webkit-animation-fill-mode: both; -moz-animation-fill-mode: both; -ms-animation-fill-mode: both; -o-animation-fill-mode: both; animation-fill-mode: both; -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -ms-backface-visibility: hidden; -o-backface-visibility: hidden; backface-visibility: hidden; }
i googled , tried different methods reason didn't work. perhaps here knows sure method!
you can try out @ www.kaidoweb.com cliking navbars left links.
Comments
Post a Comment