lightbox transition

stable
Juanfran 2014-08-06 08:31:50 +02:00
parent ba454aecd4
commit 2d8b04663a
3 changed files with 14 additions and 4 deletions

View File

@ -25,10 +25,17 @@ bindOnce = @.taiga.bindOnce
class LightboxService extends taiga.Service
open: (lightbox) ->
lightbox.addClass('open')
lightbox.css('display', 'flex')
setTimeout ( ->
lightbox.addClass('open')
), 70
close: (lightbox) ->
lightbox.removeClass('open')
lightbox
.one "transitionend", () ->
lightbox.css('display', 'none')
.removeClass('open')
module.service("lightboxService", LightboxService)

View File

@ -55,7 +55,7 @@ ProjectsNavigationDirective = ($rootscope) ->
timeout = 500 - timeout
setTimeout ( ->
overlay.one 'webkitTransitionEnd transitionend transitionEnd', () ->
overlay.one 'transitionend', () ->
overlay.hide()
$(document.body)

View File

@ -1,9 +1,11 @@
.lightbox {
@include background-opacity($white, .95);
@include table-flex(center, center, flex, row, wrap, center);
@include transition (opacity .3s ease);
bottom: 0;
display: none;
left: 0;
opacity: 0;
position: fixed;
right: 0;
top: 0;
@ -31,7 +33,8 @@
text-align: center;
}
&.open {
display: flex;
@include transition (opacity .3s ease);
opacity: 1;
}
}