https://www.respecta.fi/static/looks/js/jquery.rwdImageMaps.js

1/*
2* rwdImageMaps jQuery plugin v1.4
3*
4* 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
5*
6* Copyright (c) 2012 Matt Stow
7* https://github.com/stowball/jQuery-rwdImageMaps
8* http://mattstow.com
9* Licensed under the MIT license
10*/
11;(function($) {
12	$.fn.rwdImageMaps = function() {
13		var $img = this,
14			version = parseFloat($.fn.jquery);
15		
16		var rwdImageMap = function() {
17			$img.each(function() {
18				if (typeof($(this).attr('usemap')) == 'undefined')
19					return;
20				
21				var that = this,
22					$that = $(that);
23				
24				// Since WebKit doesn't know the height until after the image has loaded, perform everything in an onload copy
25				$('<img />').load(function() {
26					var w,
27						h,
28						attrW = 'width',
29						attrH = 'height';
30					
31					// jQuery < 1.6 incorrectly uses the actual image width/height instead of the attribute's width/height
32					if (version < 1.6)
33						w = that.getAttribute(attrW),
34						h = that.getAttribute(attrH);
35					else
36						w = $that.attr(attrW),
37						h = $that.attr(attrH);
38					
39					if (!w || !h) {
40						var temp = new Image();
41						temp.src = $that.attr('src');
42						if (!w)
43							w = temp.width;
44						if (!h)
45							h = temp.height;
46					}
47					
48					var wPercent = $that.width()/100,
49						hPercent = $that.height()/100,
50						map = $that.attr('usemap').replace('#', ''),
51						c = 'coords';
52					
53					$('map[name="' + map + '"]').find('area').each(function() {
54						var $this = $(this);
55						if (!$this.data(c))
56							$this.data(c, $this.attr(c));
57						
58						var coords = $this.data(c).split(','),
59							coordsPercent = new Array(coords.length);
60						
61						for (var i = 0; i < coordsPercent.length; ++i) {
62							if (i % 2 === 0)
63								coordsPercent[i] = parseInt(((coords[i]/w)*100)*wPercent);
64							else
65								coordsPercent[i] = parseInt(((coords[i]/h)*100)*hPercent);
66						}
67						$this.attr(c, coordsPercent.toString());
68					});
69				}).attr('src', $that.attr('src'));
70			});
71		};
72		$(window).resize(rwdImageMap).trigger('resize');
73		
74		return this;
75	};
76})(jQuery);