Example of image map rollover

An image map is usually a picture that has many clickable areas or hotspots. Clicking on the regions will let users access to additional information in a pop-up infobox, or link to other associated video clips or photo albums. In the past, only web programmers knew how to code HTML can create image maps with different sections that will respond differently on rollover. With iMapBuilder - mapping software, users can create rollover image map easily without any HTML or Flash knowledge.

Note: You can try our iiCreator if you would like to create interactive image map for mobile and tablet devices. Click here to view more HTML5 interactive image samples.

Place a mouse over the animated icons for more details.

 

Import your own map image

  1. Click Create in the Create New Map Project panel. Click Import a custom map image button to insert your own custom image in JPG/ PNG/ GIF format.

    import a custom map image

Add mouse over tooltips/ infobox to show text and/or images

  1. Select marker tool to add points or draw clickable areas on top of the map. For details, please visit our user guide of adding points or defining clickable regions.

  2. Enter text descriptions and/or insert image for each points or regions under Mouseover/ Click Event tab. Click apply to continue.

    add information on mouseover tooltips