javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2026-03-13 10:22:08 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(nav): prevent flickers between views

Browse Source 
By default the scroll bar is being created for each view, then
immediately it adds the .scroll-bar-fade-out class. On every transition
you sometimes saw the scroll bar appear then fade away quickly. Sure
that was annoying and has been fixed to prevent that, but the real
issue is that on every view transition, the scroll bar’s opacity
transition fired off a transitionend event, which bubbled up to the
view and messed with Angular’s $animate. If timed out correctly, at the
time the scroll bar’s transitionend event bubbled up, and an element
was actively leaving the view, it would confuse $animate and cause the
leave animation to abruptly end, which caused an ugly flicker.
This commit is contained in:
Adam Bradley
2014-09-16 22:58:20 -05:00
parent 83d58d3873
commit 03086ed228
2 changed files with 2 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
js/views/scrollView.js
View File

@@ -918,7 +918,7 @@ ionic.views.Scroll = ionic.views.View.inherit({
var bar = document.createElement('div'),
indicator = document.createElement('div');
indicator.className = 'scroll-bar-indicator';
indicator.className = 'scroll-bar-indicator scroll-bar-fade-out';
if(direction == 'h') {
bar.className = 'scroll-bar scroll-bar-h';

3
scss/_scaffolding.scss
View File

@@ -137,10 +137,9 @@ body.grade-c {
border-radius: 4px;
background: rgba(0,0,0,0.3);
opacity: 1;
@include transition(opacity .3s linear);
&.scroll-bar-fade-out {
@include transition(opacity 0.3s linear);
opacity: 0;
}
}