Difference between revisions of "Team:CLSB-UK/Templates/Synecho"

 
(15 intermediate revisions by the same user not shown)
Line 1: Line 1:
 
<html>
 
<html>
 
<style>
 
<style>
.v1 {
 
background-color: #941f33;
 
}
 
.v2 {
 
background-color: #941f8a;
 
}
 
.v3 {
 
background-color: #5b1f94;
 
}
 
.v4 {
 
background-color: #1f3894;
 
}
 
.v5 {
 
background-color: #1f9094;
 
}
 
.v6 {
 
background-color: #e3e567;
 
}
 
 
#cellpicdiv {
 
#cellpicdiv {
 
position: relative;
 
position: relative;
Line 28: Line 10:
 
width:100%;
 
width:100%;
 
}
 
}
.clickpic {
+
.clickdiv {
 
position: absolute;
 
position: absolute;
 
}
 
}
 +
.clicka {
 +
position: absolute;
 +
display: block;
 +
}
 +
#picdesc {
 +
position: absolute;
 +
bottom: 0;
 +
right: 0;
 +
color: #ffffff;
 +
}
 +
 +
body {
 +
background-image:url("https://static.igem.org/mediawiki/2016/c/c3/T--CLSB-UK--bgsyenchoj.jpg");
 +
background-repeat: repeat-y;
 +
background-size: 100vw;
 +
}
 +
 
</style>
 
</style>
 
<div id="cellpicdiv">
 
<div id="cellpicdiv">
 
<img src="https://static.igem.org/mediawiki/2016/e/e5/T--CLSB-UK--CellDiagram.png" id="cellpic">
 
<img src="https://static.igem.org/mediawiki/2016/e/e5/T--CLSB-UK--CellDiagram.png" id="cellpic">
<a href="https://2016.igem.org/Team:CLSB-UK/Project/CmpA"><img src="https://static.igem.org/mediawiki/2016/d/d8/T--CLSB-UK--cmpaclose.png" style="left:0; top: 23.15%; width: 23.40%; height: 24.83%" class="clickpic"></a>
+
<a href="https://2016.igem.org/Team:CLSB-UK/Project/CmpA" style="left:0.8%; top: 26.3%; width: 18.7%; height: 18.5%" class="clicka"></a>
 +
<a href="https://2016.igem.org/Team:CLSB-UK/Project/pDF" style="left:22.1%; top: 37.4%; width: 15.6%; height: 13.0%" class="clicka"></a>
 +
<a href="https://2016.igem.org/Team:CLSB-UK/Project/Synechocystis/About" style="left:40.0%; top: 36.7%; width: 30.3%; height: 23.4%" class="clicka"></a>
 +
<a href="https://2016.igem.org/Team:CLSB-UK/Project/AmilCP" style="left:27.1%; top: 55.8%; width: 18.3%; height: 22.9%" class="clicka"></a>
 +
<a href="https://2016.igem.org/Team:CLSB-UK/Project/Porins" style="left:45.7%; top: 3.05%; width: 14.2%; height: 12.6%" class="clicka"></a>
 +
<a href="https://2016.igem.org/Team:CLSB-UK/Project/Riboflavin" style="left:79.3%; top: 64.2%; width: 15.8%; height: 14.6%" class="clicka"></a>
 +
<h5 id="picdesc">Click on different parts on the picture to find out more!</h5>
 
</div>
 
</div>
  
<ul id="verticalselector" style="left:43vw">
 
<li class="v1"> <a href="https://2016.igem.org/Team:CLSB-UK/Project/Synechocystis/About">
 
<img src="https://static.igem.org/mediawiki/2016/9/9d/T--CLSB-UK--ArrowIcon.png">
 
<div class="v1"> About </div>
 
</a> </li>
 
<li class="v2"> <a href="https://2016.igem.org/Team:CLSB-UK/Project/CmpA">
 
<img src="https://static.igem.org/mediawiki/2016/9/9d/T--CLSB-UK--ArrowIcon.png">
 
<div class="v2"> CmpA </div>
 
</a> </li>
 
<li class="v3"> <a href="https://2016.igem.org/Team:CLSB-UK/Project/AmilCP">
 
<img src="https://static.igem.org/mediawiki/2016/9/9d/T--CLSB-UK--ArrowIcon.png">
 
<div class="v3"> AmilCP </div>
 
</a> </li>
 
<li class="v4"> <a href="https://2016.igem.org/Team:CLSB-UK/Project/Porins">
 
<img src="https://static.igem.org/mediawiki/2016/9/9d/T--CLSB-UK--ArrowIcon.png">
 
<div class="v4"> Porins </div>
 
</a> </li>
 
<li class="v5"> <a href="https://2016.igem.org/Team:CLSB-UK/Project/Riboflavin">
 
<img src="https://static.igem.org/mediawiki/2016/9/9d/T--CLSB-UK--ArrowIcon.png">
 
<div class="v5"> Riboflavin </div>
 
</a> </li>
 
<li class="v6"> <a href="https://2016.igem.org/Team:CLSB-UK/Project/pDF">
 
<img src="https://static.igem.org/mediawiki/2016/9/9d/T--CLSB-UK--ArrowIcon.png">
 
<div class="v6"> pDF Plasmid </div>
 
</a> </li>
 
</ul>
 
 
</html>
 
</html>

Latest revision as of 22:21, 18 October 2016

Click on different parts on the picture to find out more!