Stack Overflow
Stack Overflow

Questions tagged [imagemap]

Image Map is a list of coordinates relating to a specific image, created in order to hyperlink areas of the image to various destinations. The intention of an image map is to provide an easy way of linking various parts of an image without dividing the image into separate image files.

In HTML, an imagemap is made of the actual image that is embedded with the <img> tag, and contains a usemap attribute.

The imagemap is comprised of the <map> tag and <area> tags, which defines the fields within the weblinks. These are similar to the <a> tag, defining which URL should be opened.

Example:

<img src="image.png" alt="alternative text" usemap="#mapname" />
<map name="mapname">
  <area shape="rect" coords="9,372,66,397" href="http://example.com/" />
</map>
871 questions
3
votes
2 answers

Image Map dynamic resize in Angular 8

I want to dynamically resize an image map. I only found a solution for jQuery (https://github.com/stowball/jQuery-rwdImageMaps) How can I realize this in Angular?
hfs23
  • 125
  • 1
  • 1
  • 9
3
votes
1 answer

Is there a way to use a image map coordinates in jquery?

I want to use the coordinates of an image map but not the map itself. So my question is can I use the coordinates of an image map and detect if a user has scrolled over those coordinates using jquery? EDIT: I'm aiming for something like this: (not…
DMar
  • 187
  • 1
  • 2
  • 9
3
votes
1 answer

Jquery zoom image with image map

I would like to implement image map along with zoom using jquery . Is there any way to do that ? .. couldn't find any tutorial/example to have them both. Greatly appreciate your help!
mpiro
  • 31
  • 1
  • 2
3
votes
1 answer

Uncaught TypeError: Cannot read property 'remove' of null

Full error: scenes.js:131 Uncaught TypeError: Cannot read property 'remove' of null at HTMLInputElement.afterTextInserted (scenes.js:131) at HTMLInputElement.dispatch (jquery-1.11.0.min.js:3) at HTMLInputElement.r.handle…
Jack
  • 69
  • 1
  • 1
  • 11
3
votes
1 answer

Handling image map clicks in a Shiny app

I'm building a Shiny app where selectInput functionality is to be presented both as a traditional HTML select dropdown and as a clickable image map. My current strategy is to link the image map polygons back to the app with a URL parameter added,…
Brian Stamper
  • 2,143
  • 1
  • 18
  • 41
3
votes
1 answer

Overlapping images w/ image maps obstructing each other

Information: The images have large transparent sections, so each must be overlapped to create the needed effect. Specifically, the clickable portions of each image are in weird trapezoid shapes meant to be pressed up against each other. Images…
Hamster
  • 2,962
  • 7
  • 27
  • 38
3
votes
0 answers

Zoom on an area of a image map

I'm currently trying to make a responsive image map where we can also zoom on specific areas. For the moment I have something like that (illustration): I have for example 3 sections for 3 different area but now what I wan't is to zoom in a…
DjezusKryst
  • 31
  • 1
  • 4
3
votes
2 answers

HTML map and area not showing up

I've been trying to place a map over a picture to make it clickable, however, the area is not working. When i inspect the page with chrome developer tools it is shown as a 0x0 area. Here is the code.
Paco Meraz
  • 407
  • 1
  • 8
  • 12
3
votes
0 answers

image change on click using imagemap

I'm trying to use one image map multiple times. The idea is that you've got an picture with image map. You click on one area (there's a highlight on the image map), you press one and and the picture is changed. The new picture is using the same…
Karen
  • 113
  • 2
  • 13
3
votes
1 answer

Is there a way to automatically generate a pseudo image map?

Hitbox Overlay IIFE Code //CSS Hitbox Solution 08-26-2015 //StackOverflow - https://stackoverflow.com/questions/32233084/show-an-element-without-hitbox-does-not-take-mouse-touch-input //Detect MouseOver…
Alexander Dixon
  • 837
  • 1
  • 9
  • 24
3
votes
1 answer

Geography quiz, highlighting the right answer

I'm doing a geography quiz with maps and image maps. The website shows country names and users have to choose the right location on the map. When users click on an area a message appears telling them if the answer is right or not. I managed to do…
Julen Linazasoro
  • 35
  • 5
3
votes
3 answers

disabling image map in mobile media screen

i want to disable my image map while media screen in mobile screen. i have trying include javascript in head tag of my html file, something like this but it shows an error error :
Ariasa
  • 1,709
  • 3
  • 13
  • 18
3
votes
2 answers

jQuery Tooltip widget well-suited to use with an IMAGE-MAP? suggestions/recommendations please

I would like to display different tooltip content for each of the areas defined in an image-map. Are there any jQuery plug-ins that have an API well-suited to use with image-maps? I would like it also be be flexible with regard to where the tooltip…
Tim
  • 5,371
  • 3
  • 32
  • 41
3
votes
1 answer

Why does .hover() not work on mapped images, but .mouseover() does?

Recently was working with image maps and trying to do something on hover of an image map. Naturally I tried .hover() first, but that didn't work and so when I tried .mouseover() that worked. My question is, why does one work and not the…
Adjit
  • 10,134
  • 12
  • 53
  • 98
3
votes
2 answers

How to embed imagemap HTML in TYPO3 with typolink / realURL functionality?

The context: I need to insert an imagemap into a page in TYPO3 6.1. As EXT:imagemap_wizard is not working currently in 6.1, I can create the imagemap offline and then insert it via the HTML content type. The question: It would be nice to be able to…
Urs
  • 4,984
  • 7
  • 54
  • 116
1 2 3
…
57 58