Line 28: | Line 28: | ||
</div> | </div> | ||
+ | |||
+ | <script type="text/javascript" src="imageMapResizer.min.js"></script> | ||
+ | <script type="text/javascript"> | ||
+ | |||
+ | $(document).ready(function() { | ||
+ | $('map').imageMapResize(); | ||
+ | }); | ||
+ | |||
+ | </script> | ||
<script> | <script> | ||
Line 50: | Line 59: | ||
<div class = "customelementM2" id = "main"> | <div class = "customelementM2" id = "main"> | ||
− | <img src="https://static.igem.org/mediawiki/2018/a/a2/T--Utrecht--2018--GroupPhoto--Main002.png" alt="LLLogggo" usemap = "#workmap" | + | <img src="https://static.igem.org/mediawiki/2018/a/a2/T--Utrecht--2018--GroupPhoto--Main002.png" alt="LLLogggo" usemap = "#workmap" style = "float:left" id = "GroupPhoto"> |
<div id = story>Hover over someones face to reveal their story</div> | <div id = story>Hover over someones face to reveal their story</div> | ||
<map name = "workmap"> | <map name = "workmap"> | ||
− | <area shape ="rect" coords=" | + | <area shape ="rect" coords="3320,880,3500,1130" onmouseover="tellStory(Marjolijn);" onmouseleave="tellStory(def);"> |
− | <area shape ="rect" coords=" | + | <area shape ="rect" coords="2900,1260,3120,1500" onmouseover="tellStory(Lorenzo);" onmouseleave="tellStory(def);"> |
− | <area shape ="rect" coords=" | + | <area shape ="rect" coords="2850,600,3000,800" onmouseover="tellStory(Helen);" onmouseleave="tellStory(def);"> |
− | <area shape ="rect" coords=" | + | <area shape ="rect" coords="1930,1040,2140,1300" onmouseover="tellStory(Floor);" onmouseleave="tellStory(def);"> |
− | <area shape ="rect" coords=" | + | <area shape ="rect" coords="2400,760,2600,1000" onmouseover="tellStory(Pim);" onmouseleave="tellStory(def);"> |
− | <area shape ="rect" coords=" | + | <area shape ="rect" coords="2050,200,2200,400" onmouseover="tellStory(Franca);" onmouseleave="tellStory(def);"> |
− | <area shape ="rect" coords=" | + | <area shape ="rect" coords="1700,580,1900,800" onmouseover="tellStory(Jolijn);" onmouseleave="tellStory(def);"> |
− | <area shape ="rect" coords=" | + | <area shape ="rect" coords="1200,250,1320,460" onmouseover="tellStory(Khadija);" onmouseleave="tellStory(def);"> |
− | <area shape ="rect" coords=" | + | <area shape ="rect" coords="2000,240,2000,400" onmouseover="tellStory(Felix);" onmouseleave="tellStory(def);"> |
− | <area shape ="rect" coords=" | + | <area shape ="rect" coords="840,500,1040,800" onmouseover="tellStory(Meine);" onmouseleave="tellStory(def);"> |
− | + | ||
</map> | </map> | ||
− | |||
</div> | </div> | ||
Revision as of 14:39, 21 August 2018
Hover over someones face to reveal their story