Questions tagged [imagemapster]

ImageMapster is a jQuery plugin that lets you activate HTML image maps without using Flash. It works just about everywhere that JavaScript does, including modern browsers, Internet Explorer 6, and mobile devices like iPads, iPhones and Androids.

ImageMapster started as a fork of David Lynch's MapHilight in early 2011. I wanted to add the ability to keep areas selected. I had a lot of ideas for interesting things that could be done with image maps, so ended up adding many more features. In the months since this began, I pretty much rewrote it from the ground up, but a few parts of the code, most notably the core VML rendering code, still inherit directly from its MapHilight roots.

I have put a great deal of effort into ensuring that ImageMapster will work reliably in many environments. Often, images will not be finished loading when the rest of a page has finished being configured. JavaScript code will usually begin running before some page images have finished loading. It is critical that images be completely loaded before ImageMapster can configure itself: it needs to know their native and display sizes, make copies, and do other work. The software uses a number of different methods, depending on the browser, to ensure that everything is ready when it begins configuration.

Additonally, ImageMapster will queue commands issued to it before configuration is complete. This means you can write post-configuration code that works against your image map without concern for the timing of images being loaded. Any commands that ImageMapster receives before it's done configuring will be queued, and processed in order once configuration is complete.

ImageMapster uses HTML5 canvases to do its work in modern browsers. In older browsers (Internet Explorer < 9) it uses VML to achieve similar effects.

ImageMapster works in all major browsers (Internet Explorer 6+, Firefox 2+, Opera, Chrome, and Safari) and on mobile devices.

134 questions
0
votes
2 answers

Imagemap: Leave clicked area's tooltip displayed on mouseout?

I am using the plugin Imagemapster to add highlighting and tooltip functions to an image map. It provides callbacks like so: image.mapster( { mapKey: 'name', listKey: 'name', onClick: function (e) { …
LBF
  • 1,133
  • 2
  • 14
  • 39
0
votes
1 answer

Using the onClick event to fill a selected region in an image map with color via ImageMapster

I am making this plant label webpage for a biology project (here: http://nspowers.org/flower/flower-parts.html). Using ImageMapster and many tutorials, I can get the image map to highlight on hover, but I cannot get the map to stay highlighted with…
Nathan
  • 89
  • 1
  • 7
0
votes
1 answer

Image mapping with jQuery, how to chang color onhover?

I have an image which I have mapped and what I want to do now , is when a user hovers on a selected mapped place, I want that part to change it's color. Here is my code:
0
votes
1 answer

Dynamically loaded imagemaps in angularjs

I have proof of concept imagemap code using angularjs here. I am writing something to behave the same as the jquery example that I put together here. You'll note in the first example doesn't work because the imagemap is being populated by a scope…
singingfish
  • 3,136
  • 22
  • 25
0
votes
1 answer

Changing img src folder from javascript imagemap

I've made an imagemap with 9 areas, using mapster. Clicking an area now results in displaying some text above the imagemap. I would like to display images from several folders instead, depending on the area that is selected. When area 'kamer1' is…
Laureus
  • 3
  • 3
0
votes
1 answer

Can I disable the "highlight on click" behavior of ImageMapster?

I want to use ImageMapster as a "nonintelligent storage" for highlights. I'm using it with AngularJS, and I need to track the highlight state etc inside the Angular scope. But I'm running into problems when I click on a highlight area, because…
Aditya M P
  • 5,127
  • 7
  • 41
  • 72
0
votes
1 answer

Deselect a selected area of imagemap when hovering over the map

I have succesfully created an imagemap using ImageMapster.js, I run into one issue though. My client wants one area to be selected when the page loads and when the user hovers over the map that the selected area becomes deselected and behaves like…
0
votes
1 answer

Can't get imagemapster to highlight (Uncaught TypeError)

I am having som issues with getting imagemapster to work properly. Try look at this: http://wecu.dk/test.html It is supposed to highlight when mouseover on some areas of the house. I have imported "jquery-1.7.1.js" and "jquery.imagemapster.js" to my…
0
votes
3 answers

Not able to run jquery fiddle code

Guys I was trying to run code from a fiddle on my local asp.net page but its not working for me.Please see where i am going wrong.I am not able to get hover effect on my page. I am not sure if i have included neccessary jquery files. fiddle url: …
user2633845
0
votes
1 answer

Fill and Mouse Hover Color in ImageMapster jQuery Plugin

I am trying to set the color for click and hovering over an image using the jquery plugin ImageMapster, and can't seem to change them to anything besides black using the fillColor and other options. Any thoughts? …
user2512696
  • 315
  • 2
  • 6
  • 13
0
votes
2 answers

jQuery sensitivity to unrelated css selectors

I have been working on a fork of this fiddle - all props go to the original author. It is designed to work with ImageMapster to highlight an html list item when hovering over the image map, and vice-versa, highlight the appropriate image map when…
0
votes
1 answer

ImageMapster - dim image

I'm using the ImageMapster library and I want to use invert effect of selecting items. I want to dim all image (make image darker) except selected area. The selected area should be colorful as is. How to do this?
BlueMan
  • 687
  • 2
  • 10
  • 23
0
votes
2 answers

imagemapster conditional altImage

Image map is about condo units floor plan. Everything is functional when the requirements changes. For some area, altImage:'images/unit.png' is used by default. New Requirement: Show only the altImage when the unit is still Available How to…
Boyd
  • 49
  • 1
  • 1
  • 8
0
votes
2 answers

Highlight text when hover imagemap area and vice versa - using imagemapster

I have an image, a simple text menu and the jQuery imagemapster plugin. When hovering an area of the image, I'd like the corresponding menu item to highlight (as in hover) and when hovering a menu item, I'd like the corresponding image map area to…
Bo.
  • 1,497
  • 3
  • 11
  • 21
0
votes
1 answer

jQuery use ImageMapper to substitute images

I am trying to improve my understanding of Javascript, jQuery and the ImageMapster plugin. For ease of explanation, here's the jsFiddle I am working on. In the jsFiddle code, each Beatle's face is bordered in red when hovered over. But the HTML also…
cssyphus
  • 37,875
  • 18
  • 96
  • 111
1 2 3
8
9