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
2
votes
0 answers

Detecting RGB of pixel tapped in Flutter Dart app

I'm developing my first application in Flutter. It mainly consists in an image with different areas and the goal is to detect the tap on different areas. The solution I'm going to use is this. The problem is that I didn't find the method to retrieve…
2
votes
2 answers

Executing javascript function with image map in HTML

I want to execute some a javascript function when i click on a certain part of the image in my cshtml page. However the clickable area does not appear. I also dont want to reference www.google.com but it requires me to have alt and href attributes.…
user6229886
2
votes
0 answers

ImageMap - zoom in when hovering over image

I'm currently working on the following: I have a big map of the world. On it, I have clickable areas, defined by image maps. What you can click on, are the countries, and those have a link that lead to a page about the country.
nameless
  • 1,483
  • 5
  • 32
  • 78
2
votes
0 answers

Is there a way to enable pinch zoom on an image map?

I'm having trouble in implement both pinch zoom by hammer.js and image map, after I put in the pinch zoom the image is able to zoom in and drag but unable to click on the area map which I have been written earlier. Any solution to this? HTML…
P.Griffin
  • 33
  • 8
2
votes
2 answers

Image Map Mouseover highlight

I am making a image map for our site navigation manual, I have generated a set of code which a div show on mouse hover... EDIT The code is all working however I need to highlight the area when mouse hover, is there an easy way to do this, I have…
nsic
  • 153
  • 4
  • 15
2
votes
1 answer

Area map not working

I have a homescreen image that I need to have different sites linked to, but am still not able to make my area map work. I've tried reordering the and and double checking spelling. I have also double checked the coordinates. Thoughts?

becky armstrong
  • 73
  • 2
  • 3
  • 9
2
votes
1 answer

Vue.js Image Map Disable area after click

I have an image with 3 areas. When I click on each area, I want a series of questions to appear. I've done this, but I want to change it a bit. Since I don't want to redirect it to a page, I am giving # as href link and I'm getting the id of the…
linous
  • 263
  • 1
  • 6
  • 17
2
votes
0 answers

I have a local image and I want to use it in my iOS app, but I want to get the tap areas in the image and then draw the animated route?

I have a local image and I want to use it in my iOS app, but I want to get the tap areas in the image and then draw the animated route? Also, the route should be shortest. Attached are the images for better understanding Plain Image [] After…
2
votes
1 answer

Uncaught TypeError: $(...).imageMapResize is not a function(…)

The code I found at https://www.npmjs.com/package/image-map-resizer produces the error: imageMapResize is not a function. How can I fix this error?
Devi Prasad
  • 829
  • 1
  • 11
  • 33
2
votes
1 answer

Image mapping like feature in Java swing, Points vs GeneralPath

My gaol is to draw several images using 2D graphics in a paintComponent() method. However, I'm not sure how I could add a MouseListener such that each image would know if it was selected. My solution thus far is too simply record the coordinates of…
Koop
  • 401
  • 2
  • 5
  • 10
2
votes
1 answer

What is the last area tag in an img map for?

So I am working on a project requiring the use of img maps. I have little experience with them and have been trying to understand why their last area tag is usually as follows.
Mike
  • 632
  • 7
  • 22
2
votes
2 answers

I need a handy jQuery tool (plugin) to work with the map

I need a handy jQuery tool (plugin) to work with the map. The project has narisovanaya map with cities marked on it, the possible routes. Example I want to: To apply the route (in this example it is shown in green) on top of the map (img) Display…
Shaliko
  • 201
  • 4
  • 10
2
votes
1 answer

Can you put an image map within an image map? (JavaScript)?

For example, by clicking certain pixels in image 1, image 2 appears. Now, how can I click certain pixels in image 2 to make image 3 appear? It seems I can only have one map for images that are already there...
ML STEIN
  • 21
  • 2
2
votes
3 answers

Jquery Map Highlight

I'm using http://plugins.jquery.com/project/maphilight for highlighting areas when I hover over an image map, but I'd also like to keep it highlighted when clicked. When another area is clicked, the previous one should fade out and the new one stay…
user141621
2
votes
1 answer

Multiple CSS on hover effects on one image

I have an image map with several coordinates, I would like an on hover effect for each section. The effect should only appear for the section which is currently on hover and the other sections should stay as normal Image map: