diff --git a/jquery.rwdImageMaps.js b/jquery.rwdImageMaps.js
index 93b3d0e..fd6713d 100644
--- a/jquery.rwdImageMaps.js
+++ b/jquery.rwdImageMaps.js
@@ -1,9 +1,9 @@
/*
-* rwdImageMaps jQuery plugin v1.6
+* rwdImageMaps jQuery plugin v1.6
*
* Allows image maps to be used in a responsive design by recalculating the area coordinates to match the actual image size on load and window.resize
*
-* Copyright (c) 2016 Matt Stow
+* Copyright (c) 2016 Matt Stow
* https://github.com/stowball/jQuery-rwdImageMaps
* http://mattstow.com
* Licensed under the MIT license
@@ -11,44 +11,52 @@
;(function($) {
$.fn.rwdImageMaps = function() {
var $img = this;
-
+
var rwdImageMap = function() {
$img.each(function() {
if (typeof($(this).attr('usemap')) == 'undefined')
return;
-
+
var that = this,
$that = $(that);
-
+
// Since WebKit doesn't know the height until after the image has loaded, perform everything in an onload copy
- $('').on('load', function() {
- var attrW = 'width',
- attrH = 'height',
- w = $that.attr(attrW),
- h = $that.attr(attrH);
-
- if (!w || !h) {
- var temp = new Image();
- temp.src = $that.attr('src');
- if (!w)
- w = temp.width;
- if (!h)
- h = temp.height;
+ $('
').on('load', function() {
+ var w, h;
+ if ($that.data('w') && $that.data('h')) {
+ w = $that.data('w');
+ h = $that.data('h');
+ } else {
+ var attrW = 'width',
+ attrH = 'height';
+ w = $that.attr(attrW);
+ h = $that.attr(attrH);
+
+ if (!w || !h) {
+ var temp = new Image();
+ temp.src = $that.attr('src');
+ if (!w)
+ w = temp.width;
+ if (!h)
+ h = temp.height;
+ }
+ $that.data('w', w);
+ $that.data('h', h);
}
-
+
var wPercent = $that.width()/100,
hPercent = $that.height()/100,
map = $that.attr('usemap').replace('#', ''),
c = 'coords';
-
+
$('map[name="' + map + '"]').find('area').each(function() {
var $this = $(this);
if (!$this.data(c))
$this.data(c, $this.attr(c));
-
+
var coords = $this.data(c).split(','),
coordsPercent = new Array(coords.length);
-
+
for (var i = 0; i < coordsPercent.length; ++i) {
if (i % 2 === 0)
coordsPercent[i] = parseInt(((coords[i]/w)*100)*wPercent);
@@ -61,7 +69,7 @@
});
};
$(window).resize(rwdImageMap).trigger('resize');
-
+
return this;
};
-})(jQuery);
+})(jQuery);
diff --git a/jquery.rwdImageMaps.min.js b/jquery.rwdImageMaps.min.js
index 61854cd..5b9e79f 100644
--- a/jquery.rwdImageMaps.min.js
+++ b/jquery.rwdImageMaps.min.js
@@ -1,11 +1,11 @@
/*
-* rwdImageMaps jQuery plugin v1.6
+* rwdImageMaps jQuery plugin v1.6
*
* Allows image maps to be used in a responsive design by recalculating the area coordinates to match the actual image size on load and window.resize
*
-* Copyright (c) 2016 Matt Stow
+* Copyright (c) 2016 Matt Stow
* https://github.com/stowball/jQuery-rwdImageMaps
* http://mattstow.com
* Licensed under the MIT license
*/
-;(function(a){a.fn.rwdImageMaps=function(){var c=this;var b=function(){c.each(function(){if(typeof(a(this).attr("usemap"))=="undefined"){return}var e=this,d=a(e);a("
").on('load',function(){var g="width",m="height",n=d.attr(g),j=d.attr(m);if(!n||!j){var o=new Image();o.src=d.attr("src");if(!n){n=o.width}if(!j){j=o.height}}var f=d.width()/100,k=d.height()/100,i=d.attr("usemap").replace("#",""),l="coords";a('map[name="'+i+'"]').find("area").each(function(){var r=a(this);if(!r.data(l)){r.data(l,r.attr(l))}var q=r.data(l).split(","),p=new Array(q.length);for(var h=0;h