Team:St Andrews/template

From 2011.igem.org

(Difference between revisions)
 
(195 intermediate revisions not shown)
Line 1: Line 1:
-
<!-- DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd" -->
+
<html>
<html>
<head>
<head>
-
 
-
<!-- Start of internal Stylesheet  (I think it's better if we build our own..) -->
 
<style type="text/css">
<style type="text/css">
-
body { background-color: #fff;
+
.a4 A:link {text-decoration: none; color: white;}
-
            color: #000;
+
.a4 A:visited {text-decoration: none; color: black;}
-
            margin: 100px;
+
.a4 A:active {text-decoration: none; color: white;}
-
            font-family: Verdana, Arial, sans-serif;
+
.a4 A:hover {text-decoration: underline; color: white;}
-
            font-size: small;  
+
-
            line-height: 140%;
+
-
            }
+
-
<!-- we can add more to this later but suggested basic structure.. -->
+
body
 +
{
 +
background-image:url('https://static.igem.org/mediawiki/2011/a/a0/Vladstudio_oxygen_2_1920x1200.jpg');
 +
background-repeat:no-repeat;
 +
background-attachment:fixed;
 +
border=none;
 +
}
-
  #title {
 
-
    width:900px;
 
-
    height:55px;
 
-
    position: relative;
 
-
    top: 0px;
 
-
    left: 0px;}
 
-
#unilogo  {
+
.firstHeading
-
    width:200px;
+
{
-
    height:50px;
+
display: none;
-
    position: absolute;
+
}
-
    top: 0px;
+
.right-menu li a
-
    left: 435px;}
+
{
 +
background-color: #000000;
 +
}
 +
.left-menu:hover
 +
{
 +
background-color: #000000;
 +
}
-
  #projectlogo {
 
-
    width:400px;
 
-
    height:50px;
 
-
    position: relative;
 
-
    top: 0px;
 
-
    left: 20px;}
 
-
#topbit {
 
-
              ]
 
-
#menu {
 
-
              }
 
-
#thepier {
+
#catlinks {
-
                }
+
border: none;
 +
background-color:transparent;
 +
}
 +
 +
#footer-box {display: none; border=none;}
 +
 +
#p-logo {
 +
position: relative;
 +
display: none;
 +
 +
}
 +
 +
  #search-controls {
 +
  display: none;}
 +
 +
#top-section {
 +
  background-color: #0;
 +
  border: none;
 +
  width:900px;
 +
  height:5px;}
 +
 +
#content {
 +
    width: 900px;
 +
    border: none;
 +
    font-family: 'Volkhov', serif;
 +
    padding:0px;
 +
    background-color:transparent;
 +
}
 +
 +
 +
 +
#projlogo
 +
{
 +
position:relative;
 +
width:718px;
 +
height:154px;
 +
background-color:#0;
 +
}   
 +
 +
#igemlogo {
 +
position:absolute;
 +
width:65px;
 +
height:50px;
 +
left:60px;
 +
top:0px;
 +
 +
}
 +
 +
.container0 {
 +
position: relative; 
 +
width:900px;
 +
height:320px;
 +
margin: 0px auto -1px auto;
 +
border="0";
 +
}
 +
 +
.leftpart {
 +
position:absolute; 
 +
width:718px;
 +
height:260px;
 +
border="0";
 +
left:0px;
 +
}
 +
 +
.rightpart {
 +
position: absolute; 
 +
right:0px;
 +
width:182px;
 +
height:260px;
 +
border="0";
 +
}
 +
 +
 +
.pierimg {
 +
position: relative;
 +
top:0px;
 +
left:0px;
 +
width:718px;
 +
height:106px;
 +
}
 +
 +
.title {
 +
width:182px;
 +
height:195px;
 +
position: absolute;
 +
bottom: 0px;
 +
right: 0px;
 +
 +
}
 +
img.ourlogo {
 +
width:182px;
 +
height: 171px;
 +
}
 +
 +
 +
.unilogo {
 +
width:182px;
 +
height:190px;
 +
position: absolute;
 +
top: 15px;
 +
right:0px;
 +
}
 +
 +
.links
 +
{
 +
position:absolute;
 +
padding:18px;
 +
text-align:center;
 +
top:75px;
 +
}
 +
 +
 +
.top-slider-main {
 +
width:900px;
 +
height:60px;
 +
overflow:hidden;
 +
position:absolute;
 +
border:0px;
 +
solid #000;
 +
z-index:10;
 +
bottom:0px;}
 +
 +
.top-slider-main div{width:280px; height:60px; position:absolute; }
 +
 +
.top-slider-main .slider-box1{z-index:94;}
 +
 +
.top-slider-main .slider-box2{margin-left:280px; z-index:95;}
 +
 +
.top-slider-main .slider-box3{margin-left:435px; z-index:96;}
 +
 +
.top-slider-main .slider-box4{margin-left:590px; z-index:97;}
 +
 +
.top-slider-main .slider-box5{margin-left:745px; z-index:98;}
 +
 +
.top-slider-main div .left{position:relative; height:100%; float:left; cursor:pointer; color:#FFF;}
 +
 +
.top-slider-main div .content{position:relative; width:119px; height:54px; color:#000; float:left; font-family: Arial, Helvetica, sans-serif; font-size:1em; background-color:#transparent; padding:3px;}
 +
 +
.top-slider-main .slider-box1 .left{}
 +
 +
.top-slider-main .slider-box2 .left{background-color:#b0c4de;}
 +
 +
.top-slider-main .slider-box3 .left{background-color:#b0c4de;}
 +
 +
.top-slider-main .slider-box4 .left{background-color:#b0c4de;}
 +
 +
.top-slider-main .slider-box5 .left{background-color:#b0c4de;}
</style>
</style>
</head>
</head>
-
 
<body>
<body>
 +
<link href='http://fonts.googleapis.com/css?family=Volkhov' rel='stylesheet' type='text/css'/>
-
<div id ='title'>
+
 
-
<div id ='unilogo'>
+
<span class="a4">
-
<a href='http://www.st-andrews.ac.uk/'>
+
<div class="container0">
-
    <img src='https://static.igem.org/mediawiki/2011/e/e0/University_logo.jpg'>
+
<div class="leftpart">
-
    </a>
+
<div id="projlogo">
 +
<img src="https://static.igem.org/mediawiki/2011/0/01/Kill.png"/>
 +
  </div>
 +
<div class="pierimg">
 +
<img border="0" src="https://static.igem.org/mediawiki/2011/b/b0/Pier.jpg"/>
 +
</div>
 +
</div>
 +
<div class="rightpart">
 +
<div id="igemlogo">
 +
    <a href="https://2011.igem.org/Main_Page"><img src="https://static.igem.org/mediawiki/2010/7/7d/ICLlogo2.png"/></a>
 +
</div>
 +
<div class ="title">
 +
        <div class ="unilogo">
 +
          <a href="http://www.st-andrews.ac.uk/"><img class="ourlogo" src="https://static.igem.org/mediawiki/2011/0/09/Standrewsteamlogo.png" border="0"/></a>
 +
         
 +
        </div>
 +
</div>
</div>
</div>
-
<div id ='projectlogo'>
+
<div class="top-slider-main">
 +
<script type="text/javascript">
 +
 
 +
var $slider_started = false;
 +
 
 +
$(document).ready(function(){
 +
 
 +
var $total_slider = $('.top-slider-main > div').length;
 +
 
 +
var $label_width = $('.top-slider-main div .left').width();
 +
 
 +
var $max_slider_width = ($total_slider -1)*$label_width;
 +
 
 +
var $extra_margin = $(' .top-slider-main div').width() - $label_width;
 +
 
 +
 +
 
 +
$('.top-slider-main div:not(.slider-box1) .left').mouseover(function(){
 +
 
 +
var $slider_index = $('.top-slider-main > div').index($(this).parent()) + 1;
 +
 
 +
if($(this).parent().hasClass('on'))
 +
 
 +
{
 +
 
 +
if($slider_started != 1)
 +
 
 +
{
 +
 
 +
$slider_started = 2;
 +
 
 +
for(i=$total_slider; i>=$slider_index; i--)
 +
 
 +
{
 +
 
 +
var $elm = $('.top-slider-main .slider-box'+i);
 +
 
 +
if($elm.hasClass('on'))
 +
 
 +
{
 +
 
 +
$elm.removeClass('on');
 +
 
 +
var $left_margin = ($label_width*(i-1)) + $extra_margin;
 +
 
 +
$elm.stop().animate({marginLeft : $left_margin}, 1500, function(){$slider_started = false;});
 +
 
 +
}
 +
 
 +
}
 +
 
 +
}
 +
 
 +
}
 +
 
 +
else
 +
 
 +
{
 +
 
 +
if($slider_started != 2)
 +
 
 +
{
 +
 
 +
$slider_started = 1;
 +
 
 +
for(i=2; i<=$slider_index; i++)
 +
 
 +
{
 +
 
 +
var $elm = $('.top-slider-main .slider-box'+i);
 +
 
 +
if(!$elm.hasClass('on'))
 +
 
 +
{
 +
 
 +
$elm.addClass('on');
 +
 
 +
var $left_margin = ($label_width*(i-1));
 +
 
 +
$elm.stop().animate({marginLeft : $left_margin}, 1500, function(){$slider_started = false;});
 +
 
 +
}
 +
 
 +
}
 +
 
 +
}
 +
 
 +
}
 +
 
 +
});
 +
 
 +
});
 +
 
 +
</script>
 +
 
 +
 
 +
 
 +
 
 +
<div class="slider-box1">
 +
 
 +
    <div class="left" style="background-image:url('https://static.igem.org/mediawiki/2011/1/18/Proj2.png');
 +
 
 +
    background-color:black;
 +
 
 +
    background-repeat:no-repeat;
 +
 
 +
    background-position:center;
 +
 
 +
    width:155px;
 +
 
 +
height:60px;">
 +
 
 +
    </div>
 +
 
 +
    <div class="content">
 +
 
 +
    <a href='https://2011.igem.org/Team:St_Andrews' class="listmain">Description</a><br />
 +
 
 +
    <a href='https://2011.igem.org/Team:St_Andrews/diary' class='listmain' id='diary'>Project Diary</a><br />
 +
 
 +
    <a href='https://2011.igem.org/Team:St_Andrews/safety' class='listmain' id='safety'>Safety Form</a><br />
 +
 
 +
    </div>
 +
 
 +
</div>
 +
 
 +
<div class="slider-box2">
 +
 
 +
    <div class="left" style="background-image:url('https://static.igem.org/mediawiki/2011/2/2a/Res2.png');
 +
 
 +
    background-color:#000000;
 +
 
 +
    background-repeat:no-repeat;
 +
 
 +
    background-position:center;
 +
 
 +
    width:155px;
 +
 
 +
height:60px;">
 +
 
 +
</div>
 +
 
 +
    <div class="content">
 +
 
 +
      <a href='https://2011.igem.org/Team:St_Andrews/switch' class='listmain' id='kill'>The Kill Switch</a><br />
 +
 
 +
    <a href='https://2011.igem.org/Team:St_Andrews/modelling' class='listmain' id='model'>Modelling</a><br />
 +
 
 +
    <a href='https://2011.igem.org/Team:St_Andrews/parts' class='listmain' id='parts'>Parts Submitted</a><br />
 +
 
 +
  </div>
 +
 
 +
</div>
 +
 
 +
<div class="slider-box3">
 +
 
 +
    <div class="left" style="background-image:url('https://static.igem.org/mediawiki/2011/2/28/App.png');
 +
 
 +
    background-color:#000000;
 +
 
 +
    background-repeat:no-repeat;
 +
 
 +
    background-position:center;
 +
 
 +
    width:155px;
 +
 
 +
height:60px;"></div>
 +
 
 +
    <div class="content">
 +
 
 +
    <a href='https://2011.igem.org/Team:St_Andrews/drugdel' class='listmain'>Drug Delivery</a><br />
 +
 
 +
                        <a href='https://2011.igem.org/Team:St_Andrews/biosafe' class='listmain'>Biosafety</a><br />
 +
 
 +
    <a href='https://2011.igem.org/Team:St_Andrews/conj' class='listmain' >Conjugation</a><br /></div>
 +
 
 +
</div>
 +
 
 +
<div class="slider-box4">
 +
 
 +
    <div class="left" style="background-image:url('https://static.igem.org/mediawiki/2011/0/00/Hprac.png');
 +
 
 +
    background-color:#000000;
 +
 
 +
    background-repeat:no-repeat;
 +
 
 +
    background-position:center;
 +
 
 +
    width:155px;
 +
 
 +
height:60px;"></div>
 +
 
 +
    <div class="content">
 +
 
 +
                        <a href='https://2011.igem.org/Team:St_Andrews/review' class='listmain' >"Is iGEM Fair?"</a><br />
 +
 
 +
    <a href='https://2011.igem.org/Team:St_Andrews/debate' class='listmain' >Panel Debate</a><br />
 +
 
 +
    <a href='https://2011.igem.org/Team:St_Andrews/essays' class='listmain' >Reflective Essays</a><br />
 +
 
 +
    </div>
 +
 
 +
</div>
 +
 
 +
<div class="slider-box5">
 +
 
 +
    <div class="left" style="background-image:url('https://static.igem.org/mediawiki/2011/e/e4/Team2.png');
 +
 
 +
    background-color:#000000;
 +
 
 +
    background-repeat:no-repeat;
 +
 
 +
    background-position:center;
 +
 
 +
    width:155px;
 +
 
 +
height:60px;"></div>
 +
 
 +
    <div class="content">
 +
 
 +
    <a href='https://2011.igem.org/Team:St_Andrews/team' class='listmain' >The Team</a><br />
 +
 
 +
    <a href='https://2011.igem.org/Team:St_Andrews/sponsors' class='listmain' >Sponsors</a><br />
 +
    <a href='https://2011.igem.org/Team:St_Andrews/collaboration' class='listmain' >Collaboration</a><br />
 +
    </div>
 +
 
 +
 
 +
 
 +
</div>   
-
  <a href='https://2010.igem.org/Team:Imperial_College_London'>
 
-
    <img src='https://static.igem.org/mediawiki/2010/9/9f/ICparalogo.png'>
 
-
    </a>
 
-
  </div>
 
</div>
</div>
 +
</div>
 +
</span>
 +
</body>
</body>
</html>
</html>

Latest revision as of 10:16, 20 September 2011