diff --git a/js/angular/service/clickBlock.js b/js/angular/service/clickBlock.js index 22deba1bd9..8db4e6e238 100644 --- a/js/angular/service/clickBlock.js +++ b/js/angular/service/clickBlock.js @@ -4,7 +4,8 @@ IonicModule '$ionicBody', '$timeout', function($document, $ionicBody, $timeout) { - var fallbackTimer; + var fallbackTimer, isAttached; + var CSS_HIDE = 'click-block-hide'; var cb = $document[0].createElement('div'); cb.className = 'click-block'; @@ -14,14 +15,17 @@ function($document, $ionicBody, $timeout) { // cancel the fallback timer $timeout.cancel( fallbackTimer ); - if(cb.parentElement) { - cb.classList.remove('hide'); - } else { - $ionicBody.append(cb); - } + ionic.requestAnimationFrame(function(){ + if(isAttached) { + cb.classList.remove(CSS_HIDE); + } else { + $ionicBody.append(cb); + } + }); + fallbackTimer = $timeout(function(){ - cb.classList.add('hide'); - }, 500); + cb.classList.add(CSS_HIDE); + }, 750); }, hide: function() { // cancel the fallback timer @@ -29,7 +33,7 @@ function($document, $ionicBody, $timeout) { // should be a minimum time it should hide ionic.requestAnimationFrame(function(){ - cb.classList.add('hide'); + cb.classList.add(CSS_HIDE); }); } }; diff --git a/scss/_util.scss b/scss/_util.scss index aa01c50316..6316d28f79 100644 --- a/scss/_util.scss +++ b/scss/_util.scss @@ -69,7 +69,11 @@ z-index: $z-index-click-block; width: 100%; height: 100%; - background: transparent; + opacity: 0; + @include translate3d(0, 0, 0); +} +.click-block-hide { + @include translate3d(-9999px, 0, 0); } .no-resize {