Difference between revisions of "Team:Exeter"

 
(132 intermediate revisions by 3 users not shown)
Line 2: Line 2:
 
<html>
 
<html>
  
−
<link href='http://fonts.googleapis.com/css?family=Ek+Mukta' rel='stylesheet' type='text/css'>
+
<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>
 +
<script src="assets/scripting.min.js"></script>-->
  
−
<!-- FACEBOOK SDK-->
+
<style type="text/css">
 +
#wrapper, #infographic, .block {
 +
    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>
 +
 
 +
<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) {
 +
 
 +
                // Prevents the default action to be triggered.
 +
                e.preventDefault();
 +
 
 +
                // Triggering bPopup when click event is fired
 +
                $('#element_to_pop_up').bPopup();
 +
 
 +
            });
  
−
    <script>
 
−
      window.fbAsyncInit = function() {
 
−
        FB.init({
 
−
          appId      : 'your-app-id',
 
−
          xfbml      : true,
 
−
          version    : 'v2.3'
 
 
         });
 
         });
−
      };
 
  
−
      (function(d, s, id){
+
    })(jQuery);
−
        var js, fjs = d.getElementsByTagName(s)[0];
+
</script>
−
        if (d.getElementById(id)) {return;}
+
 
−
        js = d.createElement(s); js.id = id;
+
<script>
−
        js.src = "//connect.facebook.net/en_US/sdk.js";
+
var myVideo = document.getElementById("video1");  
−
        fjs.parentNode.insertBefore(js, fjs);
+
 
−
      }(document, 'script', 'facebook-jssdk'));
+
function playPause() {
−
     </script>
+
    if (myVideo.paused)
 +
        myVideo.play();
 +
    else
 +
        myVideo.pause();  
 +
}  
 +
 
 +
function makeBig() {
 +
    myVideo.width = 560;
 +
}
 +
 
 +
function makeSmall() {
 +
    myVideo.width = 320;
 +
}
 +
 
 +
function makeNormal() {
 +
    myVideo.width = 420;  
 +
}
 +
</script>
 +
 
 +
 
 +
<div id="infographic" onload="$('#element_to_pop_up').bPopup();">
 +
 
 +
<!-- 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>
  
−
<!-- FACEBOOK thing 1 -->
+
<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 id="fb-root"></div>
 
−
<script>(function(d, s, id) {
 
−
  var js, fjs = d.getElementsByTagName(s)[0];
 
−
  if (d.getElementById(id)) return;
 
−
  js = d.createElement(s); js.id = id;
 
−
  js.src = "//connect.facebook.net/en_GB/sdk.js#xfbml=1&version=v2.3";
 
−
  fjs.parentNode.insertBefore(js, fjs);
 
−
}(document, 'script', 'facebook-jssdk'));</script>
 
  
−
<div class="row">
 
−
                <div class="col-md-8">
 
−
<section>
 
−
                    <h1> Welcome to Exeter iGEM 2015! </h1>
 
−
</br>
 
−
<h1> Project Description </h1>
 
  
−
<p> The primary aim of our project is to design a toehold switch (a type of riboregulator) with the potential to detect any given RNA sequence, and to standardise it into a BioBrick for the future use by other iGEM teams. </p>
+
<div style="background:#274e13; width:100%" class="container">
−
<p> Tuberculosis in cattle is a problem local to our region, Devon, causing devastating economic and personal losses to farmers in the dairy and beef industries. Therefore, the immediate application of our project is the detection of <i>Mycobacterium bovis</i>, the causative agent of tuberculosis in cattle, in a safe, low-tech and cost-effective manner. </p>
+
<!-- This is where my buttons are -->
−
<p> In order to make this a simple test which can be used in the field, we are aiming to express it as a cell-free system. We hope to use a chromoprotein as an indicator, and subsequently characterise it for use in cell-free systems. </p>
+
<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>
  
−
<p style="font-size:1.2em;">Keep updated on our progress on our <a href="https://2015.igem.org/Team:Exeter/diary">diary</a></p>
 
−
<p style="font-size:1.2em;">Contact us at <a href="mailto:exeterigem@gmail.com?body=Hello Exeter,">exeterigem@gmail.com</a></p>
 
−
</section>
 
−
                </div>
 
−
                <!-- /.col-md-8 -->
 
−
               
 
−
               
 
−
               
 
−
                <div class="col-md-4">
 
−
                    <section class="panel panel-default">
 
−
                    <!-- TWITTER thing-->
 
−
<a class="twitter-timeline" href="https://twitter.com/ExeteriGEM2015" width="500px" height="355px" data-widget-id="616553862611271680">Tweets by @ExeteriGEM2015 </a> <script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+"://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>
 
−
                    </section>
 
−
                    <!-- /.panel -->
 
−
                    <div class="panel panel-default">
 
−
                    <!-- FACEBOOK thing 2 -->
 
−
<div class="fb-page" data-href="https://www.facebook.com/exeterigem2015?fref=ts" data-width="400" data-height="355" data-small-header="false" data-adapt-container-width="true" data-hide-cover="false" data-show-facepile="true" data-show-posts="true"><div class="fb-xfbml-parse-ignore"><blockquote cite="https://www.facebook.com/exeterigem2015?fref=ts"><a href="https://www.facebook.com/exeterigem2015?fref=ts">Exeter iGEM 2015</a></blockquote></div></div>
 
−
                    </div>
 
−
                    <!-- /.panel -->
 
−
                    <center>
 
−
                    <a href="#wrapper" class="btn btn-default">TOP ^</a>
 
−
                    </center>
 
−
                </div>
 
−
                <!-- /.col-md-4 -->
 
−
            </div>
 
−
            <!-- /.row -->
 
  
 
</html>
 
</html>
 
{{Exeterfooter}}
 
{{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