Difference between revisions of "Team:Exeter"

 
(252 intermediate revisions by 7 users not shown)
Line 1: Line 1:
−
<style type="text/css">
+
{{Exeter}}
 +
<html>
  
−
/* WIKI SETTINGS*/
+
<script src="https://2015.igem.org/Team:Exeter/bpopup/assets/jquery-bpopup-0-11-0-min-js?action=raw&amp;ctype=text/javascript"></script>
−
+
<!--<script src="assets/jquery.easing.1.3.js"></script>
−
/* Hide first heading */
+
<script src="assets/scripting.min.js"></script>-->
−
.firstHeading {
+
−
display: none;
+
−
}
+
−
+
−
/*-- Remove borders, float content left and remove padding/margin */
+
−
#globalWrapper, #content{
+
−
background-color: transparent;
+
−
border: 0px;
+
−
float: center;
+
−
                                width: 99.5%;
+
−
margin-left:auto;
+
−
                                margin-right:auto;
+
−
padding-top: -5px;
+
−
}
+
  
−
/*left align Black Menu Bar */
+
<style type="text/css">
−
#top_menu_inside {  
+
#wrapper, #infographic, .block {
−
margin-left: 20px;  
+
    width:100%;
−
}
+
}
 +
#wrapper {
 +
    margin:0;
 +
}
 +
#infographic {
 +
    margin-top:35px;
 +
    position: relative;
 +
    display: inline-block;
 +
}
 +
 
 +
#element_to_pop_up {
 +
    background-color:#fff;
 +
    border-radius:15px;
 +
    color:#000;
 +
    display:none;
 +
    padding:20px;
 +
    min-width:400px;
 +
    min-height: 180px;
 +
}
 +
.b-close{
 +
    cursor:pointer;
 +
    position:absolute;
 +
    right:10px;
 +
    top:5px;
 +
}
 +
#my-button {
 +
    z-index: 10;
 +
    position: absolute;
 +
    top: 53px;
 +
    left: 30px;
 +
    border-radius: 25px;
 +
    border: 1px solid #274e13;
 +
    background: #b6d7a8;
 +
    padding: 15px;
 +
    box-shadow: 0px 0px 25px #888888;
 +
}
 
</style>
 
</style>
  
−
<html>
+
<script>
 +
    // Semicolon (;) to ensure closing of earlier scripting
 +
    // Encapsulation
 +
    // $ is assigned to jQuery
 +
    ;(function($) {
  
 +
        // DOM Ready
 +
        $(function() {
 +
            $(document).ready(function() {
 +
              $('#element_to_pop_up').bPopup();
 +
            });
 +
            // Binding a click event
 +
            // From jQuery v.1.7.0 use .on() instead of .bind()
 +
            $('#my-button').bind('click', function(e) {
  
−
<head>
+
                // Prevents the default action to be triggered.
−
    <title> Exeter iGEM 2015 </title>
+
                e.preventDefault();
−
</head>
+
  
−
<body>
+
                // Triggering bPopup when click event is fired
−
    <!--Navigation Bar-->
+
                $('#element_to_pop_up').bPopup();
−
    <div class="nav">
+
−
      <div class="container">
+
−
        <div class="pull-left">
+
−
          <!--logo-->
+
−
  <img src=''/>
+
−
        </div>
+
−
        <ul class="pull-right">
+
−
          <li><a href="https://2015.igem.org/Team:Exeter/Home">Home</a></li>
+
−
          <li><a href="https://2015.igem.org/Team:Exeter/Team">Team</a></li>
+
−
          <li><a href="https://2015.igem.org/Team:Exeter/Description">Project</a></li>
+
−
  <li><a href="https://2015.igem.org/Team:Exeter/Human_Practices">Human Practices</a></li>
+
−
  <li><a href="https://2015.igem.org/Team:Exeter/Notebook">Notebook</a></li>
+
−
  <!--iGEM logo-->
+
−
  <li><img src='File:Exeter_igem_logo.jpg'/></li>
+
−
        </ul>
+
−
      </div>
+
−
    </div>
+
−
+
−
    <div class="main">
+
−
        <img src="https://static.igem.org/mediawiki/2015/f/f7/Exeter-Exeter_Under_construction.jpg", width="700">
+
−
    </div>
+
  
−
    <div class="tail">
+
             });
−
      <div class="container">
+
−
        <ul class="pull-left">
+
−
             <!--logo-->
+
−
    <li><a href="https://2015.igem.org/Team:Exeter/Safety">Safety</a></li>
+
−
    <li><a href="https://2015.igem.org/Team:Exeter/Medal_Requirements">Medal Requirements</a></li>
+
−
        </ul>
+
−
        <div class="pull-right">
+
−
    <!--Sponsors-->
+
−
            <li><img src=''/></li>
+
−
        </div>
+
−
      </div>
+
−
    </div>
+
−
</body>
+
−
   
+
  
−
<!-- Start of CSS-->
+
        });
−
<style type="text/css">
+
  
−
body {
+
    })(jQuery);
−
background: #fff;
+
</script>
−
}
+
  
−
.main img {
+
<script>
−
  azimuth: center;
+
var myVideo = document.getElementById("video1");  
−
  padding: 20px;
+
−
}
+
  
−
.nav li, .tail li {
+
function playPause() {  
−
display: inline;
+
    if (myVideo.paused)
−
text-decoration: none;
+
        myVideo.play();  
−
font-size: 30px;
+
    else
−
font-family: Impact, serif;
+
        myVideo.pause();  
−
padding: 10px;
+
}  
−
}
+
  
−
.tail {
+
function makeBig() {  
−
clear: both;
+
    myVideo.width = 560;  
−
float: bottom;
+
}  
−
}
+
  
−
.pull-left {
+
function makeSmall() {  
−
float: left;
+
    myVideo.width = 320;  
−
}
+
}  
  
−
.pull-right {
+
function makeNormal() {  
−
float: right;
+
    myVideo.width = 420;  
−
}
+
}  
 +
</script>
  
−
.firstHeading {
 
−
  display: none;
 
−
}
 
  
−
</style>
+
<div id="infographic" onload="$('#element_to_pop_up').bPopup();">
−
<!-- End of CSS -->
+
 
 +
<!-- Button that triggers the popup -->
 +
<button id="my-button">Watch Our Video</button>
 +
<!-- Element to pop up -->
 +
<div id="element_to_pop_up">
 +
  <center>
 +
        <button onclick="playPause()">Play/Pause</button>
 +
    <video id="video1" width="320" height="240" autoplay>
 +
        <source src="https://static.igem.org/mediawiki/2015/5/5c/Bovine_TB_1_.mp4" type="video/mp4">
 +
        Your browser does not support the video tag.
 +
    </video>
 +
    <p style="font-size:1em">Click outside window to close</p> <a href="https://youtu.be/HTQQr_W3q2s"> Click to see our Video </a>
 +
  </center>
 +
</div>
 +
 
 +
<img class="block" src="https://static.igem.org/mediawiki/2015/d/d6/Exeter_home1.png"/>
 +
<img class="block" src="https://static.igem.org/mediawiki/2015/0/0b/Exeter_home2.png"/>
 +
<img class="block" src="https://static.igem.org/mediawiki/2015/4/4f/Exeter_home3.png"/>
 +
<img class="block" src="https://static.igem.org/mediawiki/2015/a/a5/Exeter_home4.png"/>
 +
<img class="block" src="https://static.igem.org/mediawiki/2015/8/88/Exeter_home5.png"/>
 +
<img class="block" src="https://static.igem.org/mediawiki/2015/d/d6/Exeter_home6.png"/>
 +
<img class="block" src="https://static.igem.org/mediawiki/2015/2/23/Exeter_home7.png"/>
 +
<img class="block" src="https://static.igem.org/mediawiki/2015/a/ab/Exeter_home8.png"/>
 +
</div>
 +
 
 +
 
 +
 
 +
<div style="background:#274e13; width:100%" class="container">
 +
<!-- This is where my buttons are -->
 +
<center style="background:#274e13; font-size:1.6em;"><a href="https://static.igem.org/mediawiki/2015/3/37/Exeter_home_infographic.png">Click here for the full infographic</a></center>
 +
        <nav>
 +
          <ul style="background:#274e13; margin:0; padding:100px;" class="pager">
 +
            <li class="previous"><a href="https://2015.igem.org/Team:Exeter/Medal_Requirements"><span aria-hidden="true">&larr;</span>Medals</a></li>
 +
            <li style="color:#b6d7a8; font-size:2em">Use these buttons to see more</li>
 +
            <li class="next"><a href="https://2015.igem.org/Team:Exeter/Description">Project<span aria-hidden="true">&rarr;</span></a></li>
 +
          </ul>
 +
        </nav>
 +
        <!-- Buttons stop -->
 +
</div>
  
  
 
</html>
 
</html>
 +
{{Exeterfooter}}

Latest revision as of 03:54, 19 September 2015

Click outside window to close

Click to see our Video
Click here for the full infographic
  • Contact us:
    exeterigem@gmail.com