Team:Colorado State

From 2012.igem.org

(Difference between revisions)
(Replaced content with "<html> <img src="https://lh5.googleusercontent.com/-Lw3nwfFW7ws/UAWcI8XQ4ZI/AAAAAAAAAL4/W7-l1JR20TU/s300/tap2.png" /> </html>")
Line 1: Line 1:
-
<html>
+
<html xmlns="http://www.w3.org/1999/xhtml">
-
<img src="https://lh5.googleusercontent.com/-Lw3nwfFW7ws/UAWcI8XQ4ZI/AAAAAAAAAL4/W7-l1JR20TU/s300/tap2.png" />
+
<head>
 +
<style type="text/css">
 +
 
 +
/*********NOTES*********
 +
 
 +
-Colors
 +
-DC8800-Medium
 +
-E9B300-Medium/Light
 +
-925F00-Dark
 +
-F1C900-Light
 +
-BDAF77-Créme/white
 +
-423600-Gold with grey overlay (27%)
 +
 
 +
/*********HIDE iGEM STUFF*********/
 +
 
 +
/*#top-section {
 +
visibility: hidden;
 +
height: 0;
 +
border: none;
 +
}*/
 +
 
 +
* {
 +
visibility: hidden;
 +
}
 +
 
 +
#csu_content *, #csu_content {
 +
visibility: visible;
 +
}
 +
 +
 
 +
/*********PAGE FORMATTING*********/
 +
 
 +
* {
 +
padding: 0;
 +
margin: 0;
 +
}
 +
 
 +
#csu_content {
 +
background: url(https://static.igem.org/mediawiki/2012/2/20/Beer1.png) top left fixed;
 +
height: 100%;
 +
width: 100%;
 +
}
 +
 
 +
#bodycontent {
 +
position: relative;
 +
top: 0;
 +
margin-left: auto;
 +
margin-right: auto;
 +
width: 700px;
 +
height: 610px;
 +
background: url(https://lh6.googleusercontent.com/-Bz9Xal7nbX0/UAWcJiyGvXI/AAAAAAAAAMM/fZZe6dB7_Vg/s912/trans1.png) repeat-y top left;
 +
 +
/*font-family: 'HoeflerText-Regular', 'Hoefler Text', 'Times New Roman', 'serif';*/
 +
font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
 +
color: #CCC;  /*******COLOR*******/
 +
}
 +
 
 +
#footer {
 +
position: absolute;
 +
width: 100%;
 +
bottom: 0;
 +
}
 +
 
 +
#content_main {
 +
padding: 40px;
 +
}
 +
 
 +
#side_bar {
 +
position: fixed;
 +
top: 250px;
 +
left: 0;
 +
width: 240px;
 +
height: 300px;
 +
z-index: 100;
 +
cursor: pointer;
 +
background: url(https://lh3.googleusercontent.com/-MtUojiC0LkI/UAWcImGPUPI/AAAAAAAAALw/wRt50IIRqwM/s300/tap1.png) no-repeat top left;
 +
}
 +
 
 +
#side_bar:hover {
 +
background: url(https://lh5.googleusercontent.com/-Lw3nwfFW7ws/UAWcI8XQ4ZI/AAAAAAAAAL4/W7-l1JR20TU/s300/tap2.png) no-repeat top left;
 +
}
 +
 
 +
a {
 +
font-weight: bold;
 +
color: #F1C900;
 +
text-decoration: none;
 +
}
 +
 
 +
a:hover {
 +
text-decoration: underline;
 +
}
 +
 
 +
/*********SLIDESHOW*********/
 +
 
 +
#slideshow {
 +
position: relative;
 +
top: 0;
 +
left: 0;
 +
width: 100%;
 +
height: 200px;
 +
}
 +
 
 +
.slide {
 +
position: absolute;
 +
width: 100%;
 +
height: 100%;
 +
}
 +
 
 +
/*********DROPDOWN CSS**********/
 +
 
 +
#menu_bar td {
 +
width: 33%;
 +
}
 +
 
 +
#menu_bar {
 +
width: 100%;
 +
overflow: hidden;
 +
color: #CCC; /*******COLOR*******/
 +
text-align: center;
 +
}
 +
 
 +
#menu_bar dt {
 +
text-align: center;
 +
width: 100%;
 +
padding: 8px;
 +
font-weight: bold;
 +
cursor: pointer;
 +
background: #925F00; /*******COLOR*******/
 +
}
 +
 
 +
#menu_bar dd {
 +
position: absolute;
 +
overflow: hidden;
 +
width: 233px;
 +
display: none;
 +
background: #E9B300; /*******COLOR*******/
 +
z-index: 200;
 +
opacity: 0;
 +
}
 +
 
 +
#menu_bar ul {
 +
width: 229px;
 +
border: 2px solid #925F00; /*******COLOR*******/
 +
list-style: none;
 +
border-top: none;
 +
}
 +
 
 +
#menu_bar li {
 +
display: inline;
 +
}
 +
 
 +
#menu_bar a, #menu_bar a:active, #menu_bar a:visited {
 +
display: block;
 +
padding: 5px;
 +
text-decoration: none;
 +
width: 100%;
 +
color: #925F00; /*******COLOR*******/
 +
border-top: 1px solid #925F00; /*******COLOR*******/
 +
}
 +
 
 +
#menu_bar a:hover {
 +
background: #F1C900; /*******COLOR*******/
 +
}
 +
 
 +
</style>
 +
<script type="text/javascript">
 +
 
 +
//*******************************************************************
 +
//************************SLIDESHOW SCRIPT***************************
 +
//*******************************************************************
 +
 
 +
//Finds the next slide and returns its 'slide' + x id.
 +
function getNextSlide(curElemID) {
 +
 +
var nextElem = document.getElementById('slide' + (curElemID + 1));
 +
if (nextElem) {
 +
var nextElemID = curElemID + 1;
 +
} else {
 +
var nextElemID = 1;
 +
} //end if
 +
 +
return nextElemID;
 +
 +
} //end function getNextSlide
 +
 
 +
//Changes menu_bar element in coordination with slides
 +
function menuBar(curElemID) {
 +
 +
nextElemID = getNextSlide(curElemID);
 +
var curMenuElem = document.getElementById(curElemID + '-ddheader');
 +
var nextMenuElem = document.getElementById(nextElemID + '-ddheader');
 +
 +
//menu_bar item change actions go here
 +
nextMenuElem.style.background = '#DC8800'; /*******COLOR*******/
 +
 +
//Change last menu_bar item back to its normal state
 +
curMenuElem.style.background = '#925F00'; /*******COLOR*******/
 +
 +
} //end function menuBar
 +
 
 +
//Performs fade animation; main function
 +
function fade(curElemID,isFading) {
 +
 +
//Length that each slide shows before fade (in milliseconds)
 +
var slideTime = 2000;
 +
 +
//Length of fade (milliseconds)
 +
var fadeTime = 1000;
 +
 +
//Fade Increments: > means smoother, more CPU-intensive transition
 +
var fadeInc = 10;
 +
 +
//In order for fade to work correctly, opacity must be rounded to
 +
//the appropriate number of decimal places.  roundTo defines this.
 +
//For fadeInc < 20, roundTo = 1 will suffice.  roundNum is the
 +
//functional form.
 +
var roundTo = 1;
 +
var roundNum = Math.pow(10, roundTo);
 +
 +
//Fetches the current slide element
 +
var curElem = document.getElementById('slide' + curElemID);
 +
 +
//Performs pre-fade functions. Function must be called with isFading = false.
 +
if (isFading == false) {
 +
 +
//Fetches the next slide element.  If there is no next slide,
 +
//return to slide1.
 +
var nextElem = document.getElementById('slide' + (curElemID + 1));
 +
if (!nextElem) {
 +
var nextElem = document.getElementById('slide1');
 +
} //end if
 +
 +
//Brings current slide to front/fading z-index (3) and puts the
 +
//next slide in the corresponding z-index (2).  Slides that are
 +
//neither the current or next slide should have z-index = 1.
 +
curElem.style.zIndex = 30;
 +
nextElem.style.zIndex = 20;
 +
 +
//Sets a preliminary opacities. Optional
 +
curElem.style.opacity = 1;
 +
nextElem.style.opacity = 1;
 +
 +
} //end if
 +
 +
//Fades out the current slide if it is not already completely faded yet
 +
if (curElem.style.opacity > 0) {
 +
 +
//Sets new opacity and reruns the function
 +
var newOpac = (Math.round(roundNum * (curElem.style.opacity - (1/fadeInc)))) / roundNum;
 +
curElem.style.opacity = newOpac;
 +
setTimeout('fade(' + curElemID + ')', (fadeTime/fadeInc));
 +
 +
//Current slide has faded completely
 +
} else {
 +
 +
//Sets the current slide to a hidden state with full opacity
 +
curElem.style.zIndex = 10;
 +
curElem.style.opacity = 1;
 +
 +
//Sets next slide element.  If there is no next slide,
 +
//return to slide1.
 +
 +
nextElemID = getNextSlide(curElemID);
 +
 +
//Starts next fade.  isFading = false is a required parameter
 +
setTimeout('fade(' + nextElemID + ',false)',slideTime);
 +
 +
//Menu bar functions
 +
menuBar(curElemID);
 +
 +
} //end if
 +
 +
} //end function fade
 +
 
 +
</script>
 +
<script type="text/javascript">
 +
 
 +
//*******************************************************************
 +
//************************DROPDOWN SCRIPT****************************
 +
//*******************************************************************
 +
 
 +
var DDSPEED = 10;
 +
var DDTIMER = 15;
 +
 
 +
// main function to handle the mouse events //
 +
function ddMenu(id,d){
 +
  var h = document.getElementById(id + '-ddheader');
 +
  var c = document.getElementById(id + '-ddcontent');
 +
  clearInterval(c.timer);
 +
  if(d == 1){
 +
clearTimeout(h.timer);
 +
if(c.maxh && c.maxh <= c.offsetHeight){return}
 +
else if(!c.maxh){
 +
  c.style.display = 'block';
 +
  c.style.height = 'auto';
 +
  c.maxh = c.offsetHeight;
 +
  c.style.height = '0px';
 +
}
 +
c.timer = setInterval(function(){ddSlide(c,1)},DDTIMER);
 +
  }else{
 +
h.timer = setTimeout(function(){ddCollapse(c)},50);
 +
  }
 +
}
 +
 
 +
// collapse the menu //
 +
function ddCollapse(c){
 +
  c.timer = setInterval(function(){ddSlide(c,-1)},DDTIMER);
 +
}
 +
 
 +
// cancel the collapse if a user rolls over the dropdown //
 +
function cancelHide(id){
 +
  var h = document.getElementById(id + '-ddheader');
 +
  var c = document.getElementById(id + '-ddcontent');
 +
  clearTimeout(h.timer);
 +
  clearInterval(c.timer);
 +
  if(c.offsetHeight < c.maxh){
 +
c.timer = setInterval(function(){ddSlide(c,1)},DDTIMER);
 +
  }
 +
}
 +
 
 +
// incrementally expand/contract the dropdown and change the opacity //
 +
function ddSlide(c,d){
 +
  var currh = c.offsetHeight;
 +
  var dist;
 +
  if(d == 1){
 +
dist = (Math.round((c.maxh - currh) / DDSPEED));
 +
  }else{
 +
dist = (Math.round(currh / DDSPEED));
 +
  }
 +
  if(dist <= 1 && d == 1){
 +
dist = 1;
 +
  }
 +
  c.style.height = currh + (dist * d) + 'px';
 +
  c.style.opacity = currh / c.maxh;
 +
  c.style.filter = 'alpha(opacity=' + (currh * 100 / c.maxh) + ')';
 +
  if((currh < 2 && d != 1) || (currh > (c.maxh - 2) && d == 1)){
 +
clearInterval(c.timer);
 +
  }
 +
}
 +
 
 +
</script>
 +
</head>
 +
<body onLoad="fade(1,false); menuBar(0);">
 +
<div id="csu_content">
 +
<a id="side_bar" href="https://2012.igem.org/Team:Colorado_State/Safety"></a>
 +
<div id="bodycontent">
 +
<div id="content_top">
 +
        <div id="slideshow">
 +
      <img src="https://lh3.googleusercontent.com/-ZigNmO_3Dg4/UAWcIJbtgZI/AAAAAAAAALg/istDqjXyEk8/s832/csu_logo.png" style="position: absolute; z-index: 200; width: 200px; top: 20px; right: 20px;" />
 +
            <img id="slide1" class="slide" src="https://lh4.googleusercontent.com/-icdH9nCgILg/UAWcJDs6qlI/AAAAAAAAAMA/I9cf4OFNE9E/s800/temp1.jpg" style="z-index: 30;" />
 +
            <img id="slide2" class="slide" src="https://lh5.googleusercontent.com/-jdDeA36YR_A/UAWcJqulWEI/AAAAAAAAAMU/qAn0y-b6j1w/s912/temp2.jpg" />
 +
            <img id="slide3" class="slide" src="https://lh3.googleusercontent.com/--Ra__21nthQ/UAWcJVWY7CI/AAAAAAAAAME/lrW_S_gHgL8/s800/temp3.jpg" />
 +
        </div>
 +
        <table id="menu_bar" cellspacing="0">
 +
        <tr>
 +
            <td>
 +
            <dl>
 +
                <dt id="1-ddheader" onMouseOver="ddMenu('1',1)" onMouseOut="ddMenu('1',-1)">Project Brew</dt>
 +
                <dd id="1-ddcontent" onMouseOver="cancelHide('1')" onMouseOut="ddMenu('1',-1)">
 +
                    <ul>
 +
                        <li><a href="https://2012.igem.org/Team:Colorado_State">Home</a></li>
 +
                        <li><a href="https://2012.igem.org/Team:Colorado_State/Project">Project</a></li>
 +
                        <li><a href="https://2012.igem.org/Team:Colorado_State/Parts">Parts Submitted to the Registry</a></li>
 +
                        <li><a href="https://2012.igem.org/Team:Colorado_State/Modeling">Modeling</a></li>
 +
                        <li><a href="https://2012.igem.org/Team:Colorado_State/Notebook">Team Notebook</a></li>
 +
                        <li><a href="https://2012.igem.org/Team:Colorado_State/Safety">Safety</a></li>
 +
                    </ul>
 +
                </dd>
 +
            </dl>
 +
            </td>
 +
            <td>
 +
            <dl>
 +
                <dt id="2-ddheader" onMouseOver="ddMenu('2',1)" onMouseOut="ddMenu('2',-1)">The Brew</dt>
 +
                <dd id="2-ddcontent" onMouseOver="cancelHide('2')" onMouseOut="ddMenu('2',-1)">
 +
                    <ul>
 +
                        <li><a href="https://2012.igem.org/Team:Colorado_State/Sponsors">Sponsors</a></li>
 +
                        <li><a href="https://2012.igem.org/Team:Colorado_State/Attributions">Attributions</a></li>
 +
                        <li><a href="#">Navigation Item 3</a></li>
 +
                        <li><a href="#">Navigation Item 4</a></li>
 +
                        <li><a href="#">Navigation Item 5</a></li>
 +
                    </ul>
 +
                </dd>
 +
            </dl>
 +
            </td>
 +
            <td>
 +
            <dl>
 +
                <dt id="3-ddheader" onMouseOver="ddMenu('3',1)" onMouseOut="ddMenu('3',-1)">The Brewers</dt>
 +
                <dd id="3-ddcontent" onMouseOver="cancelHide('3')" onMouseOut="ddMenu('3',-1)">
 +
                    <ul>
 +
                        <li><a href="https://2012.igem.org/Team:Colorado_State/Team">Team</a></li>
 +
                        <li><a href="https://igem.org/Team.cgi?year=2012&team_name=Colorado_State">Official Team Page</a></li>
 +
                        <li><a href="#">Navigation Item 3</a></li>
 +
                        <li><a href="#">Navigation Item 4</a></li>
 +
                        <li><a href="#">Navigation Item 5</a></li>
 +
                    </ul>
 +
                </dd>
 +
            </dl>
 +
            </td>
 +
        </tr>
 +
        </table>
 +
    </div>
 +
    <div id="content_main">
 +
    <a href="https://2012.igem.org/wiki/index.php?title=Team:Colorado_State&amp;action=edit">Edit page</a>
 +
        <br>
 +
    <a href="http://rclouse145.wix.com/2012csuigem#!home/mainPage">http://rclouse145.wix.com/2012csuigem#!home/mainPage</a>
 +
        <br>
 +
    <p>Duis nonsequ ismodol et oreetuer iril dolore facidunt, vulluptat volore consecte dolesed dolor velit ver adionse ot magnisc illandi et gniamet, vendre feum veniamc onullutpatin hent ipit wisi esse dolesting ero dunt utpatin vel ipit, quation ullum aut prat. Am autet, quatet nos od minci euip enim deles sequisl et ullutat augait facilla ad ea autpatie eui blan henim adte facip eugait lametue rostis nonsenibh exeriliquat incin heniam, secte at dolesequat nulla facilit la consectet nim iusto dunt utpatin vel ipit, quation magnis do et nit augiatie erat.</p>
 +
    </div>
 +
    <div id="footer">
 +
    <img src="https://lh6.googleusercontent.com/-svMAaTUB0PU/UAWcIJr06oI/AAAAAAAAALc/rjGl0om85xQ/s139/apple.png" style="position: absolute; z-index: 10; bottom: -10px; left: 40%;" />
 +
    <img src="https://lh4.googleusercontent.com/-sb7abRaUzoA/UAWcIeh1pxI/AAAAAAAAALo/p8byjTol0CU/s912/footer.png" style="position: absolute; width: 100%; height: auto; z-index: 5;"/>
 +
</div>
 +
</div>
 +
</div>
 +
</body>
</html>
</html>

Revision as of 17:41, 17 July 2012

Edit page
http://rclouse145.wix.com/2012csuigem#!home/mainPage

Duis nonsequ ismodol et oreetuer iril dolore facidunt, vulluptat volore consecte dolesed dolor velit ver adionse ot magnisc illandi et gniamet, vendre feum veniamc onullutpatin hent ipit wisi esse dolesting ero dunt utpatin vel ipit, quation ullum aut prat. Am autet, quatet nos od minci euip enim deles sequisl et ullutat augait facilla ad ea autpatie eui blan henim adte facip eugait lametue rostis nonsenibh exeriliquat incin heniam, secte at dolesequat nulla facilit la consectet nim iusto dunt utpatin vel ipit, quation magnis do et nit augiatie erat.

Retrieved from "http://2012.igem.org/Team:Colorado_State"