Template:ImageMap

From 2009.igem.org

An image map (using just rectangular regions) with rollover effects can be created using this template (if the necessary images are available already). For example (note that it is important not to prepend the URLs with https://2009.igem.org, as this will cause them to be expanded img tags...):

{{imageMap|imap|/wiki/images/8/89/Arsenic_Filtering_System.png|604|400|
{{imageMapLink|arsenic|36|0|145|68|/wiki/images/2/2d/Arsenic_Filtering_System_-_Arsenic.png}}
{{imageMapLink|transport|65|54|116|120|/wiki/images/4/44/Arsenic_Filtering_System_-_Transport.png}}
{{imageMapLink|accumulation|152|147|163|63|/wiki/images/8/84/Arsenic_Filtering_System_-_Accumulation.png}}
{{imageMapLink|gas|400|90|136|97|/wiki/images/7/72/Arsenic_Filtering_System_-_Gas_Vesicles.png}}
{{imageMapLink|promoter|111|291|168|61|/wiki/images/5/5c/Arsenic_Filtering_System_-_Promoter.png}}
}}<html><center>
<ul id="imap">
<li id="arsenic"></html>It all starts with [[Team:Groningen/Vision|arsenic]] in solution.<html></li>
<li id="transport"></html>[[Team:Groningen/Project/Transport|Metal transport]]<html></li>
<li id="accumulation"></html>[[Team:Groningen/Project/Accumulation|Metal accumulation]]<html></li>
<li id="gas"></html>[[Team:Groningen/Project/Vesicle|Gas Vesicle]]<html></li>
<li id="promoter"></html>[[Team:Groningen/Project/Promoters|Metal sensitive promoters]]<html></li>
</ul>
</center></html>

Generates: