Team:Uppsala/jstest

From 2013.igem.org

(Difference between revisions)
 
(6 intermediate revisions not shown)
Line 1: Line 1:
-
{{Team:Uppsala/standard-style}}
+
ul.enlarge{
-
{{Team:Uppsala/lightbox-style}}
+
list-style-type:none; /*remove the bullet point*/
 +
margin-left:0;
 +
}
 +
ul.enlarge li{
 +
display:inline-block; /*places the images in a line*/
 +
position: relative;
 +
z-index: 0; /*resets the stack order of the list items - later we'll increase this*/
 +
margin:10px 40px 0 20px;
 +
}
 +
ul.enlarge img{
 +
background-color:#eae9d4;
 +
padding: 6px;
 +
-webkit-box-shadow: 0 0 6px rgba(132, 132, 132, .75);
 +
-moz-box-shadow: 0 0 6px rgba(132, 132, 132, .75);
 +
box-shadow: 0 0 6px rgba(132, 132, 132, .75);
 +
-webkit-border-radius: 4px;
 +
-moz-border-radius: 4px;
 +
border-radius: 4px;
 +
}
 +
ul.enlarge span{
 +
position:absolute;
 +
left: -9999px;
 +
background-color:#eae9d4;
 +
padding: 10px;
 +
font-family: 'Droid Sans', sans-serif;
 +
font-size:.9em;
 +
text-align: center;
 +
color: #495a62;
 +
-webkit-box-shadow: 0 0 20px rgba(0,0,0, .75));
 +
-moz-box-shadow: 0 0 20px rgba(0,0,0, .75);
 +
box-shadow: 0 0 20px rgba(0,0,0, .75);
 +
-webkit-border-radius: 8px;
 +
-moz-border-radius: 8px;
 +
border-radius:8px;
 +
}
 +
ul.enlarge li:hover{
 +
z-index: 50;
 +
cursor:pointer;
 +
}
 +
ul.enlarge span img{
 +
padding:2px;
 +
background:#ccc;
 +
}
 +
ul.enlarge li:hover span{
 +
top: -300px; /*the distance from the bottom of the thumbnail to the top of the popup image*/
 +
left: -20px; /*distance from the left of the thumbnail to the left of the popup image*/
 +
}
-
<html>
+
ul.enlarge li:hover:last-child span{
-
 
+
-
<head>
+
-
<meta charset="utf-8" />
+
-
<title>Uppsala iGEM 2013</title>
+
-
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
+
-
<link rel="stylesheet" type="text/css" href="css/style.css">
+
-
<link rel="stylesheet" type="text/css" href="css/biyo.css">
+
-
<link href="css/lightbox.css" rel="stylesheet" />
+
-
<style type="text/css">
+
-
 
+
-
</style>
+
-
 
+
-
<script src="js/jquery-1.10.2.min.js"></script>
+
-
<script src="js/lightbox-2.6.min.js"></script>
+
-
 
+
-
</head>
+
-
 
+
-
<body>
+
-
 
+
-
<!--Main frame contains all the div elements-->
+
-
 
+
-
<div id= "main_frame">
+
-
 
+
-
<!--Contains our top header-->
+
-
 
+
-
<div id= "header">
+
-
<!-- Contains sub-logo picture -->
+
left: -400px
-
<div id="igem_logo"><a href="https://2013.igem.org/Main_Page"><img class="igem_logo" src="https://static.igem.org/mediawiki/2013/e/e0/Uppsala2013_IGEMlogo.png"></a></div>
+
}
-
+
-
<div id="igem"><a href="https://2013.igem.org/Main_Page"><img class="igem" src="https://static.igem.org/mediawiki/2013/b/b8/Uppsala2013_Uppsala_IGEM_log_blue.png"></a></div>
+
-
+
-
</div>
+
-
<!-- Contains the "nav div" and the stripe background for the navigation menu -->
+
ul.enlarge li:hover:nth-child(3) span{
-
 
+
-
<div id="navbar">
+
-
 
+
-
<!-- Contains the navigation menu with list elements, buged on local server, works on mediawiki!!-->
+
-
+
-
<div id="nav">
+
-
<div id="cow-box"><a href="https://2013.igem.org/Team:Uppsala"><img class="home-knapp" src="https://static.igem.org/mediawiki/2013/e/ef/Uppsala2013_Home.png"><a/></div>
+
-
<ul>
+
-
<li><a href="https://2013.igem.org/Team:Uppsala/project" id="list_type1"><img class="nav-text" src="https://static.igem.org/mediawiki/2013/a/aa/Uppsala2013_Project.png"></a>
+
-
<ul>
+
-
<li><a href="https://2013.igem.org/Team:Uppsala/overview">Overview</a></li>
+
-
<li><a href="https://2013.igem.org/Team:Uppsala/chassi">Chassi</a>
+
-
<ul>
+
-
                                                                <li><a href="https://2013.igem.org/Team:Uppsala/probiotics">Probiotics</a></li>
+
-
<li><a href="https://2013.igem.org/Team:Uppsala/promoters">Promoters</a></li>
+
-
<li><a href="https://2013.igem.org/Team:Uppsala/reporter-genes">Reporter genes</a></li>
+
-
<li><a href="https://2013.igem.org/Team:Uppsala/affinity-tags">Toxin-antitoxin system</a></li>
+
-
<li><a href="https://2013.igem.org/Team:Uppsala/vectors">Vectors</a></li>
+
-
                                                                <li><a href="https://2013.igem.org/Team:Uppsala/signal-peptide">Signal peptide</a></li>
+
-
</ul></li>
+
-
                                               
+
-
                                                <li><a href="https://2013.igem.org/Team:Uppsala/metabolic-engineering">Metabolic engineering</a>
+
-
                                                    <ul>
+
-
                                                                <li><a href="https://2013.igem.org/Team:Uppsala/p-coumaric-acid">P-coumeric acid</a></li>
+
-
                                                                <li><a href="https://2013.igem.org/Team:Uppsala/resveratrol">Resveratrol</a></li>
+
-
<li><a href="https://2013.igem.org/Team:Uppsala/lycopene">Lycopene</a></li>
+
-
<li><a href="https://2013.igem.org/Team:Uppsala/betacarotene">β-carotene</a></li>
+
-
<li><a href="https://2013.igem.org/Team:Uppsala/astraxantin">Astraxantin</a></li>
+
-
<li><a href="https://2013.igem.org/Team:Uppsala/zeaxantin">Zeaxantin</a></li>
+
-
</ul></li>
+
-
</li>
+
-
<li><a href="https://2013.igem.org/Team:Uppsala/chromoproteins">Chromoprotein</a></li>
+
-
<li><a href="https://2013.igem.org/Team:Uppsala/safety">Safety experiments</a></li>
+
-
<li><a href="https://2013.igem.org/Team:Uppsala/result">Result</a></li>
+
-
+
-
+
-
</ul></li>
+
-
 
+
-
<li><a href="https://2013.igem.org/Team:Uppsala/modeling" id="list_type1"><img class="nav-text" src="https://static.igem.org/mediawiki/2013/6/63/Uppsala2013_Modeling.png"></a>
+
-
<ul>
+
-
<li><a href="https://2013.igem.org/Team:Uppsala/resveratrol-pathway">Resveratrol pathway </a></li>
+
-
<li><a href="https://2013.igem.org/Team:Uppsala/carotenoids-pathway">Carotenoids pathway </a></li>
+
-
</ul></li>
+
-
<li><a href="https://2013.igem.org/Team:Uppsala/parts" id="list_type2"><img class="nav-text" src="https://static.igem.org/mediawiki/2013/e/eb/Uppsala2013_parts.png"></a></li>
+
-
+
-
<li><a href="https://2013.igem.org/Team:Uppsala/team" id="list_type2"><img class="nav-text" src="https://static.igem.org/mediawiki/2013/a/a7/Uppsala2013_Team.png"></a>
+
-
<ul>
+
-
<li><a href="https://2013.igem.org/Team:Uppsala/resveratrol-group">Resveratrol group</a></li>
+
-
<li><a href="https://2013.igem.org/Team:Uppsala/carotenoid-group">Carotenoid group</a></li>
+
-
<li><a href="https://2013.igem.org/Team:Uppsala/chassi-group">Chassi group</a></li>
+
-
<li><a href="https://2013.igem.org/Team:Uppsala/advisors">Advisors</a></li>
+
-
</ul></li>
+
-
<li><a href="https://2013.igem.org/Team:Uppsala/hp" id="list_type3"><img class="nav-text"      src="https://static.igem.org/mediawiki/2013/b/b8/Uppsala2013_HP.png"></a>
+
-
<ul>
+
-
<li><a href="https://2013.igem.org/Team:Uppsala/Yoghurtproducts">Yoghurt products</a></li>
+
-
<li><a href="https://2013.igem.org/Team:Uppsala/synbioday">SynBio Day</a></li>
+
-
<li><a href="https://2013.igem.org/Team:Uppsala/bioethics">Bioethics</a></li>
+
-
<li><a href="https://2013.igem.org/Team:Uppsala/safety">Bioethics and Safety</a></li>
+
-
<li><a href="https://2013.igem.org/Team:Uppsala/society">Society and Outreach</a></li>
+
-
<li><a href="https://2013.igem.org/Team:Uppsala/highschool-outreach">High School Outreach</a></li>
+
-
                                                <li><a href="https://2013.igem.org/Team:Uppsala/outreach">Media Outreach</a></li>
+
-
</ul></li>
+
-
<li><a href="https://2013.igem.org/Team:Uppsala/attribution" id="list_type4"><img class="nav-text" src="https://static.igem.org/mediawiki/2013/5/5d/Uppsala2013_Attributions.png"></a></li>
+
-
<li><a href="https://2013.igem.org/Team:Uppsala/notebook" id="list_type3"><img class="nav-text" src="https://static.igem.org/mediawiki/2013/3/36/Uppsala2013_Notebook.png"></a>
+
-
                                    <ul>
+
-
                                        <li><a href="https://2013.igem.org/Team:Uppsala/protocol">Protocol</a></li>
+
-
                                        <li><a href="https://2013.igem.org/Team:Uppsala/lab-journal">Lab journal</a></li>
+
-
                                    </ul></li>
+
-
</ul>
+
-
</div>
+
-
+
-
</div>
+
-
 
+
-
 
+
-
<div id="main_content"> <!-- Put content here -->
+
-
<a href="img/demopage/image-2.jpg" data-lightbox="roadtrip"><img src="img/demopage/image-2.jpg"></a>
+
left: -400px
-
<a href="img/demopage/image-3.jpg" data-lightbox="roadtrip"><img src="img/demopage/image-3.jpg"></a>
+
}
-
<a href="img/demopage/image-4.jpg" data-lightbox="roadtrip"><img src="img/demopage/image-4.jpg"></a>
+
-
 
+
-
</div> <!-- main_content ends -->
+
-
+
-
<div id="bottom-pic">
+
-
<img class="bottom-pic" src="https://static.igem.org/mediawiki/2013/a/aa/Bottom_picture.png">
+
-
</div>
+
-
 
+
-
+
-
+
-
</div> <!--Closing div element for main frame-->
+
-
 
+
-
 
+
-
 
+
-
</body>
+
-
 
+
-
</html>
+

Latest revision as of 18:07, 26 September 2013

ul.enlarge{ list-style-type:none; /*remove the bullet point*/ margin-left:0; } ul.enlarge li{ display:inline-block; /*places the images in a line*/ position: relative; z-index: 0; /*resets the stack order of the list items - later we'll increase this*/ margin:10px 40px 0 20px; } ul.enlarge img{ background-color:#eae9d4; padding: 6px; -webkit-box-shadow: 0 0 6px rgba(132, 132, 132, .75); -moz-box-shadow: 0 0 6px rgba(132, 132, 132, .75); box-shadow: 0 0 6px rgba(132, 132, 132, .75); -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; } ul.enlarge span{ position:absolute; left: -9999px; background-color:#eae9d4; padding: 10px; font-family: 'Droid Sans', sans-serif; font-size:.9em; text-align: center; color: #495a62; -webkit-box-shadow: 0 0 20px rgba(0,0,0, .75)); -moz-box-shadow: 0 0 20px rgba(0,0,0, .75); box-shadow: 0 0 20px rgba(0,0,0, .75); -webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius:8px; } ul.enlarge li:hover{ z-index: 50; cursor:pointer; } ul.enlarge span img{ padding:2px; background:#ccc; } ul.enlarge li:hover span{ top: -300px; /*the distance from the bottom of the thumbnail to the top of the popup image*/ left: -20px; /*distance from the left of the thumbnail to the left of the popup image*/ }

ul.enlarge li:hover:last-child span{

left: -400px }

ul.enlarge li:hover:nth-child(3) span{

left: -400px }

Retrieved from "http://2013.igem.org/Team:Uppsala/jstest"