How To Show Tooltip on Click and How to Close Tool Tip in Fancybox?

[msmith29063]

I have two support-related questions:

1. I need to show the tooltips on click as opposed to mouseover. What I've done is not working. Here's my javascript:

   $('#popupLocations .map').mapster({
   altImage: '',
   fillOpacity: 1.0,
   isSelectable: false,
   mapKey: 'name',
   showToolTip: true,
   toolTipContainer: 'HTML here...',
   toolTipClose: ['area-click'],
   areas: [
   {
   key: 'South Carolina',
   toolTip: 'Tooltip content here...'
   }
   ],
   onClick: function(e) {
   $(this).mapster('tooltip');
   }
   });

2. This imagemap is actually being displayed in a jQuery fancybox popup. When I close the popup -- the tooltip from the ImageMapster is left still showing. How do I make sure the tooltips close when the popup is closed?

Any help you can provide would be greatly appreciated. Thank you.

[rezico]

Well iam also looking for solution to open the tooltips after click on the specific area.

[junasmarts]

i have same problem, is there any solution for this problem?

[techfg]

Hello @msmith29063 -

Thank you for the question, apologies for the delayed reply!

Regarding your questions:

1. You are on the right track by implementing a handler for onClick. However, when showToolTip === true, IM will show the tooltip (if defined) on mouseover so since you indicated you want to show onClick as opposed to mouseover, you want to set showToolTip to false. Additionally, since you have configured toolTipClose to include area-click, what is occurring on click is that the tooltip is immediately closing because the area is being clicked so you want to remove that option.

2. There was a bug in IM that was recently fixed that would result in any open tooltips remaining visible after an 'unbind', see Tooltips do not close on unbind #349 for details. You'll want to update to at least v1.4.0 to include this fix (I recommend updating to latest version of 1.5.1) and make sure you call unbind when your fancybox closes.

Version 1.4.0 also includes several other tooltip fixes & enhancements including a new toolTipClose type of image-click as well as the ability to define a function for toolTip to avoid having to define each area with a specific hardcoded toolTip value.

Please see this fiddle for a full example of what I believe you are trying to achieve.

@rezico @junasmarts - Hopefully this helps address your questions as well.

As an aside, for general IM related questions, please see our Support page for the best way to receive help in the future.

Hope this helps!