lightbox transition
parent
ba454aecd4
commit
2d8b04663a
|
@ -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)
|
||||
|
||||
|
|
|
@ -55,7 +55,7 @@ ProjectsNavigationDirective = ($rootscope) ->
|
|||
timeout = 500 - timeout
|
||||
|
||||
setTimeout ( ->
|
||||
overlay.one 'webkitTransitionEnd transitionend transitionEnd', () ->
|
||||
overlay.one 'transitionend', () ->
|
||||
overlay.hide()
|
||||
|
||||
$(document.body)
|
||||
|
|
|
@ -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;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
Loading…
Reference in New Issue