Merge pull request #5 from loveky/bug/fix-2

(fix) make modal background not clickable [Fixes #2]
jimobrien · Sep 14, 2014 · 407a3e2 · 407a3e2
2 parents 28ba075 + c6328ca
commit 407a3e2
Show file tree

Hide file tree

Showing 5 changed files with 28 additions and 12 deletions.
diff --git a/dist/angular-morph.js b/dist/angular-morph.js
@@ -74,9 +74,13 @@
         },
         fade: function (element) {
           element.css({
-            'visibility': 'visible',
-            'opacity': '1'
+            'display': 'block'
           });
+          setTimeout(function() {
+            element.css({
+              'opacity': '1'
+            });
+          }, 25);
         }
       };
 
@@ -122,6 +126,11 @@
           element.css({
             'opacity': '0'
           });
+          setTimeout(function() {
+            element.css({
+              'display': 'none'
+            });
+          }, 525);
         }
       };
 
@@ -484,7 +493,7 @@
         'outline': 'none',
       },
       fade: {
-        'visibility': 'hidden',
+        'display': 'none',
         'opacity': '0',
         'position': 'fixed',
         'top': '0',
@@ -494,8 +503,7 @@
         'height': '100%',
         'background': 'rgba(0,0,0,0.5)',
         '-webkit-transition': 'opacity 0.5s',
-        'transition': 'opacity 0.5s',
-        'pointer-events': 'none'
+        'transition': 'opacity 0.5s'
       }
 
     };

diff --git a/dist/angular-morph.min.js b/dist/angular-morph.min.js
diff --git a/spec/transitions/modalSpec.js b/spec/transitions/modalSpec.js
@@ -91,7 +91,7 @@ describe('Modal Transition', function(){
       });
 
       waitsFor(function() {
-        return getComputedStyle(morphable.find("div")[0], null).visibility === "visible";
+        return getComputedStyle(morphable.find("div")[0], null).opacity === "1";
       }, "wrapper should be visible to user", 35);
 
       runs(function() {

diff --git a/src/morphAssist.js b/src/morphAssist.js
@@ -24,7 +24,7 @@
         'outline': 'none',
       },
       fade: {
-        'visibility': 'hidden',
+        'display': 'none',
         'opacity': '0',
         'position': 'fixed',
         'top': '0',
@@ -34,8 +34,7 @@
         'height': '100%',
         'background': 'rgba(0,0,0,0.5)',
         '-webkit-transition': 'opacity 0.5s',
-        'transition': 'opacity 0.5s',
-        'pointer-events': 'none'
+        'transition': 'opacity 0.5s'
       }
 
     };

diff --git a/src/transitions/modal.js b/src/transitions/modal.js
@@ -63,9 +63,13 @@
         },
         fade: function (element) {
           element.css({
-            'visibility': 'visible',
-            'opacity': '1'
+            'display': 'block'
           });
+          setTimeout(function() {
+            element.css({
+              'opacity': '1'
+            });
+          }, 25);
         }
       };
 
@@ -111,6 +115,11 @@
           element.css({
             'opacity': '0'
           });
+          setTimeout(function() {
+            element.css({
+              'display': 'none'
+            });
+          }, 525);
         }
       };