Team:UNAM-Genomics Mexico/Templates/Team

From 2011.igem.org

(Difference between revisions)
(changed footer and header font style)
(Created one screen per option and the javascript code to stack them properly)
Line 2: Line 2:
<!--
<!--
-
@VERSION 1.0.9
+
@VERSION 1.1.0
@NAME    /Templates/Team
@NAME    /Templates/Team
@DESC    This is a wiki template designed for the welcoming page.
@DESC    This is a wiki template designed for the welcoming page.
Line 20: Line 20:
     var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
     var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
   })();
   })();
 +
 +
</script>
 +
<script language="JavaScript"  type="text/javascript">
 +
 +
var currOnTop = getElementById("psiScreen");
 +
function HeapScreen(currId){
 +
currOnTop.style.zIndex = "1";
 +
currOnTop = getElementById( currId + "Screen" );
 +
currOntTop.style.zIndex = "2";
 +
}
</script>
</script>
Line 63: Line 73:
height: 650px;
height: 650px;
margin: 0 auto;
margin: 0 auto;
-
padding: 20px 0px 20px 0px;
+
padding: 0px;
border: none;
border: none;
z-index: 0;
z-index: 0;
Line 123: Line 133:
margin-top: 0px;
margin-top: 0px;
font-size: 95%;
font-size: 95%;
-
font-family: sans serif;
+
font-family: sans-serif;
}
}
#menubar ul{
#menubar ul{
Line 167: Line 177:
border: none;
border: none;
font-size: 95%;
font-size: 95%;
-
font-family: sans serif;
+
font-family: sans-serif;
}
}
ul#f-list{
ul#f-list{
Line 191: Line 201:
/*******************************
/*******************************
-
   Window Control Properties
+
   Screen Control Properties
*******************************/
*******************************/
/*Bar Properties*/
/*Bar Properties*/
-
div.window_bar{
+
div.bar{
margin: 0px;
margin: 0px;
padding: 5px;
padding: 5px;
width: 990px;
width: 990px;
height: 50px;
height: 50px;
-
background-color: #0033AA;
 
}
}
-
div#topBar{
+
/*Sepparating space: 20px;*/
 +
/*Box Properties*/
 +
div.box{
 +
margin: 0px;
 +
padding: 5px;
 +
width: 140px;
 +
height: 140px;
 +
}
 +
/*Screen Properties*/
 +
div.screen{
 +
margin: 0px;
 +
padding: 5px;
 +
width: 650px;
 +
height: 480px;
 +
position: absolute;
 +
top: 80px;
 +
left: 170px;
 +
z-index: 1;
 +
}
 +
 
 +
div#psi {
position: absolute;
position: absolute;
top: 0px;
top: 0px;
left: 0px;
left: 0px;
 +
backgound-color: #44CC44;
}
}
-
div#bottomBar{
+
div#omega {
position: absolute;
position: absolute;
bottom: 0px;  
bottom: 0px;  
left: 0px;
left: 0px;
 +
backgound-color: #444444;
}
}
-
/*Sepparating space: 20px;*/
+
div#alpha{
-
/*Box Properties*/
+
-
div.window_box{
+
-
margin: 0px;
+
-
padding: 5px;
+
-
width: 140px;
+
-
height: 140px;
+
-
background-color: #3300AA;
+
-
}
+
-
div#leftTopBox{
+
position: absolute;
position: absolute;
top: 80px;
top: 80px;
left: 0px;
left: 0px;
 +
backgound-color: #CC4444;
}
}
-
div#leftMiddleBox{
+
div#beta{
position: absolute;
position: absolute;
top: 250px;
top: 250px;
left: 0px;
left: 0px;
 +
backgound-color: #4444CC;
}
}
-
div#leftBottomBox{
+
div#gamma{
position: absolute;
position: absolute;
top: 420px;
top: 420px;
left: 0px;
left: 0px;
 +
backgound-color: #44CCCC;
}
}
-
div#rightTopBox{
+
div#delta{
position: absolute;
position: absolute;
top: 80px;
top: 80px;
right: 0px;
right: 0px;
 +
backgound-color: #CC44CC;
}
}
-
div#rightMiddleBox{
+
div#epsilon{
position: absolute;
position: absolute;
top: 250px;
top: 250px;
right: 0px;
right: 0px;
 +
backgound-color: #CCCC44;
}
}
-
div#rightBottomBox{
+
div#zeta{
position: absolute;
position: absolute;
top: 420px;
top: 420px;
right: 0px;
right: 0px;
 +
backgound-color: #CCCCCC;
}
}
-
div#window{
+
div#psiScreen {
-
margin: 0px;
+
backgound-color: #44CC44;
-
padding: 5px;
+
z-index: 2;
-
width: 650px;
+
}
-
height: 480px;
+
div#alphaScreen {
-
background-color: #3300AA;
+
backgound-color: #CC4444;
-
position: absolute;
+
}
-
top: 80px;
+
div#betaScreen {
-
left: 170px;
+
backgound-color: #4444CC;
 +
}
 +
div#gammaScreen {
 +
backgound-color: #44CCCC;
 +
}
 +
div#deltaScreen {
 +
backgound-color: #CC44CC;
 +
}
 +
div#epsilonScreen {
 +
backgound-color: #CCCC44;
 +
}
 +
div#zetaScreen {
 +
backgound-color: #CCCCCC;
 +
}
 +
div#omegaScreen {
 +
backgound-color: #444444;
}
}
Line 266: Line 309:
</html>
</html>
-
<div id="topBar" class="window_bar">{{{upInfo}}}</div>
+
<div id="psi" class="bar" onMouseOver="HeapScreen(this.id); return(true);">Psi</div>
-
<div id="leftTopBox" class="window_box">{{{opt1}}}</div>
+
<div id="psiScreen" class="screen">==psiPSIpsiPSIpsi==</div>
-
<div id="leftMiddleBox" class="window_box">{{{opt2}}}</div>
+
 
-
<div id="leftBottomBox" class="window_box">{{{opt3}}}</div>
+
<div id="alpha" class="box" onMouseOver="HeapScreen(this.id); return(true);">Alpha</div>
-
<div id="window">{{{window_content}}}</div>
+
<div id="alphaScreen" class="screen">==alphaALPHAalpha==</div>
-
<div id="rightTopBox" class="window_box">{{{opt4}}}</div>
+
 
-
<div id="rightMiddleBox" class="window_box">{{{opt5}}}</div>
+
<div id="beta" class="box" onMouseOver="HeapScreen(this.id); return(true);">Beta</div>
-
<div id="rightBottomBox" class="window_box">{{{opt6}}}</div>
+
<div id="betaScreen" class="screen">==betaBETAbeta==</div>
-
<div id="bottomBar" class="window_bar">{{{downInfo}}}</div>
+
 
 +
<div id="gamma" class="box" onMouseOver="HeapScreen(this.id); return(true);">Gamma</div>
 +
<div id="gammaScreen" class="screen">==gammaGAMMAgamma==</div>
 +
 
 +
<div id="delta" class="box" onMouseOver="HeapScreen(this.id); return(true);">Delta</div>
 +
<div id="deltaScreen" class="screen">==deltaDELTAdelta==</div>
 +
 
 +
<div id="epsilon" class="box" onMouseOver="HeapScreen(this.id); return(true);">Epsilon</div>
 +
<div id="epsilonScreen" class="screen">==epsilonEPSILONepsilon==</div>
 +
 
 +
<div id="zeta" class="box" onMouseOver="HeapScreen(this.id); return(true);">Zeta</div>
 +
<div id="zetaScreen" class="screen">==zetaZETAzeta==</div>
 +
 
 +
<div id="omega" class="bar" onMouseOver="HeapScreen(this.id); return(true);">Omega</div>
 +
<div id="omegaScreen" class="screen">==omegaOMEGAomega==</div>

Revision as of 00:11, 23 July 2011

UNAM-Genomics_Mexico

Psi
==psiPSIpsiPSIpsi==
Alpha
==alphaALPHAalpha==
Beta
==betaBETAbeta==
Gamma
==gammaGAMMAgamma==
Delta
==deltaDELTAdelta==
Epsilon
==epsilonEPSILONepsilon==
Zeta
==zetaZETAzeta==
Omega
==omegaOMEGAomega==