Template:ImageMap

From 2009.igem.org

Revision as of 14:08, 14 September 2009 by Jaspervdg (Talk | contribs)

(diff) ← Older revision | Latest revision (diff) | Newer revision → (diff)

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: