0.1.6 - fix percentage sizes + wrapper blocking clicks

yyx990803 · Jan 14, 2014 · a992101 · a992101
1 parent 942ca9d
commit a992101
Show file tree

Hide file tree

Showing 5 changed files with 19 additions and 8 deletions.
diff --git a/.gitignore b/.gitignore
@@ -1 +1,2 @@
-.DS_Store
+.DS_Store
+test
diff --git a/bower.json b/bower.json
@@ -1,6 +1,6 @@
 {
   "name": "zoomerang",
-  "version": "0.1.5",
+  "version": "0.1.6",
   "description": "drop-in zoomer for anything",
   "main": "zoomerang.js",
   "ignore": [

diff --git a/component.json b/component.json
@@ -1,6 +1,6 @@
 {
   "name": "zoomerang",
-  "version": "0.1.5",
+  "version": "0.1.6",
   "description": "drop-in zoomer for anything",
   "main": "zoomerang.js",
   "scripts": [

diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "zoomerang",
-  "version": "0.1.5",
+  "version": "0.1.6",
   "description": "drop-in zoomer for anything",
   "main": "zoomerang.js",
   "repository": {

diff --git a/zoomerang.js b/zoomerang.js
@@ -4,6 +4,9 @@
 
 (function () {
 
+    // regex
+    var percentageRE = /^([\d\.]+)%$/
+
     // elements
     var overlay = document.createElement('div'),
         wrapper = document.createElement('div'),
@@ -186,10 +189,16 @@
             }, true)
 
             // deal with % width and height
-            setStyle(wrapper, {
-                width: p.width + 'px',
-                height: p.height + 'px'
-            })
+            var wPctMatch = target.style.width.match(percentageRE),
+                hPctMatch = target.style.height.match(percentageRE)
+            if (wPctMatch || hPctMatch) {
+                var wPct = wPctMatch ? +wPctMatch[1] / 100 : 1,
+                    hPct = hPctMatch ? +hPctMatch[1] / 100 : 1
+                setStyle(wrapper, {
+                    width: ~~(p.width / wPct) + 'px',
+                    height: ~~(p.height / hPct) + 'px'
+                })
+            }
 
             // insert overlay & placeholder
             parent.appendChild(overlay)
@@ -269,6 +278,7 @@
     }
 
     overlay.addEventListener('click', api.close)
+    wrapper.addEventListener('click', api.close)
 
     // umd expose
     if (typeof exports == "object") {