Socket
Book a DemoInstallSign in
Socket

image-map-resizer

Package Overview
Dependencies
Maintainers
1
Versions
16
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

image-map-resizer

Make the HTML image map responsive, so the map scales with the image

latest
Source
npmnpm
Version
1.0.10
Version published
Maintainers
1
Created
Source

Image Map Resize

npm version license Blazing Donate

This is a simple library that makes HTML Image Maps responsive, so that they automagically stay scaled to the size of the image they are attached to. It detects the window being resized and updates the co-ordinates of the image map accordingly.

This library can be used with or without jQuery.

Native JS Usage

Include the imageMapResizer.min.js script then add the following call to the bottom of your page:

imageMapResize();

Optionally you can pass a CSS selector that returns a collection of map tags, for example 'map.myMap'. Or a direct reference to a map object in the DOM. This function returns an array of map elements that it has been bound to.

jQuery Usage

Include jQuery and the imageMapResizer.min.js script and then add the following call to the bottom of your page:

$('map').imageMapResize();

Or you may want to wrap it in a $(document).ready() function:

$(document).ready(function() {
    $('map').imageMapResize();
});

Example

http://davidjbradshaw.com/imagemap-resizer/example/

WordPress

There is a port of this library to WordPress made by @iankevinmcdonald https://wordpress.org/plugins/add-image-maps/

IE8 Support

Version 1.0 of this project is optimised for IE9 and above. If you still require support for IE8 then please use V0.6.x. Both versions are functionally equivalent.

License

Copyright © 2014-19 David J. Bradshaw. Licensed under the MIT license.

NPM

Keywords

imagemap

FAQs

Package last updated on 10 Apr 2019

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts