diff options
| -rw-r--r-- | src/lightbox.js | 13 | ||||
| -rw-r--r-- | src/shadow.js | 7 |
2 files changed, 13 insertions, 7 deletions
diff --git a/src/lightbox.js b/src/lightbox.js index 579f14b..5523fc7 100644 --- a/src/lightbox.js +++ b/src/lightbox.js @@ -55,9 +55,13 @@ export default class LightBox { */ openLightBox(image) { + image.style.visibility = 'hidden'; const shadow = this.shadows[image.id] || new Shadow(image); if (!this.shadows[image.id]) { this.shadows[image.id] = shadow; + shadow.element.addEventListener('click', () => { + if (shadow.isOpen) this.closeLightBox(image); + }); } shadow.open(); @@ -65,4 +69,13 @@ export default class LightBox { this.overlay.add(shadow); this.overlay.show(); } + + closeLightBox(image) { + image.style.visibility = 'visible'; + const shadow = this.shadows[image.id]; + if (!shadow) return; + + shadow.close(); + this.overlay.hide(); + } } diff --git a/src/shadow.js b/src/shadow.js index 6051cd9..120404a 100644 --- a/src/shadow.js +++ b/src/shadow.js @@ -11,7 +11,6 @@ export default class Shadow { constructor(image) { this.create(image); this.calculateStartsAndFinals(); - this.bindCloseEvent(); return this; } @@ -33,12 +32,6 @@ export default class Shadow { this.element = shadowImage; } - bindCloseEvent() { - this.element.addEventListener('click', () => { - if (this.isOpen) this.close(); - }); - } - calculateStartsAndFinals() { // get starting state this.startingState = { |