Difference between revisions of "Team:Judd UK/"

 
(25 intermediate revisions by 2 users not shown)
Line 5: Line 5:
 
  * Copyright Aleksandur Murfitt
 
  * Copyright Aleksandur Murfitt
 
  * Released under the MIT license
 
  * Released under the MIT license
  * (<[URL]>)/license.txt
+
  *  
 +
* https://2017.igem.org/Judd_UK/license
 
  *
 
  *
 
  * Date: 2017-10-01T12:38Z
 
  * Date: 2017-10-01T12:38Z
 
-->
 
-->
 
<div class="JC">
 
<div class="JC">
     <script>
+
   
        var page = window.location.search.substring(1);
+
     <script src="/Template:Judd_UK/pagelist?action=raw&ctype=text/javascript" async></script>
        console.log(page);
+
        window.history.replaceState(null, null, page.replace(/\*/g, "/") + ".html");
+
 
+
    </script>
+
 
     <link rel="stylesheet" href="/Template:Judd_UK/Stylesheets/main?action=raw&ctype=text/css">
 
     <link rel="stylesheet" href="/Template:Judd_UK/Stylesheets/main?action=raw&ctype=text/css">
 
     <script src="/Template:Judd_UK/Scripts/wiki?action=raw&ctype=text/javascript" async></script>
 
     <script src="/Template:Judd_UK/Scripts/wiki?action=raw&ctype=text/javascript" async></script>
 +
<script src="/Template:Judd_UK/Scripts/BSS?action=raw&ctype=text/javascript" defer></script>
 +
<link rel="stylesheet" href="/Template:Judd_UK/Stylesheets/BSS?action=raw&ctype=text/css">
 
     <style id="topstyles"></style>
 
     <style id="topstyles"></style>
 +
    <div id="loadbar"></div>
 
     <header id="Header">
 
     <header id="Header">
         <img id="handle" href="£Home" src="/wiki/images/c/c8/T--Judd_UK--iGEMLogo-Handle.png" />
+
         <img id="handle" href="#" onclick="editable()" src="/wiki/images/c/c8/T--Judd_UK--iGEMLogo-Handle.png" />
         <img id="sprite" href="£Home" src="/wiki/images/9/9e/T--Judd_UK--iGEMLogo-sprite.png" />
+
         <img id="sprite" href="#" onclick="editable()" src="/wiki/images/9/9e/T--Judd_UK--iGEMLogo-sprite.png" />
         <img id="main-img" href="£Home" alt="iGEM Logo" src="/wiki/images/8/85/T--Judd_UK--iGEMLogo-small.png" />
+
         <img id="main-img" href="#"onclick="editable()" alt="iGEM Logo" src="/wiki/images/8/85/T--Judd_UK--iGEMLogo-small.png" />
 
         <span id="O1">
 
         <span id="O1">
                 <a href="£Page-13">Home</a>
+
                 <a href="https://2017.igem.org/Team:Judd_UK">Home</a>
 
         </span>
 
         </span>
 +
        <div id="D2" class="D"></div>
 
         <span id="O2">
 
         <span id="O2">
 
                 <a>Project</a>
 
                 <a>Project</a>
                 <ul style="left:-25%">
+
                 <ul style="left:-25%"></ul>
                    <li id="O2-S1">
+
        </span>
                        <a href="#O2-S1">Submenu 1</a>
+
        <div id="D3" class="D"></div>
                    </li>
+
                    <li>
+
                        <ul class="sub">
+
                            <li><a href="£Page-1">Page 1</a></li>
+
                            <li>Page 2</li>
+
                        </ul>
+
                    </li>
+
                    <li id="O2-S2">
+
                        <a href="#O2-S2">Submenu 2</a>
+
                    </li>
+
                    <li>
+
                        <ul class="sub">
+
                            <li>Page 3</li>
+
                            <li>Page 4</li>
+
                        </ul>
+
                    </li>
+
                    <li><a href="£Page-5">Page 5</a></li>
+
                </ul>
+
            </span>
+
 
         <span id="O3">
 
         <span id="O3">
                 <a href="£Human-Practices">Human Practices</a>
+
                 <a>Human Practices</a>
                 </span>
+
                 <ul style="left:25%"></ul>
 +
        </span>
 +
        <div id="D4" class="D"></div>
 
         <span id="O4">
 
         <span id="O4">
 
                 <a>Team</a>
 
                 <a>Team</a>
                 <ul style="left:75%">
+
                 <ul style="left:75%"></ul>
                    <li id="O3-S1">
+
        </span>
                        <a href="#O3-S1">Submenu 1</a>
+
                    </li>
+
                    <li>
+
                        <ul class="sub">
+
                            <li><a href="£Page-1">Page 1</a></li>
+
                            <li>Page 2</li>
+
                        </ul>
+
                    </li>
+
                    <li id="O3-S2">
+
                        <a href="#O3-S2">Submenu 2</a>
+
                    </li>
+
                    <li>
+
                        <ul class="sub">
+
                            <li>Page 3</li>
+
                            <li>Page 4</li>
+
                        </ul>
+
                    </li>
+
                    <li><a href="£Page-5">Page 5</a></li>
+
                </ul>
+
            </span>
+
 
     </header>
 
     </header>
    <!--<bar-loader></bar-loader>-->
 
    <!--<div id="site-index">
 
            <h4>Pages</h4>
 
            <ul style="list-style: none; padding-left: 20px;">
 
            </ul>
 
        </div>-->
 
 
     <div id="content-container">
 
     <div id="content-container">
        <!--Wiki pages go here. Everything here with
 
                    a 'content-' id will be erased on reload-->
 
 
         <div id="content-index">
 
         <div id="content-index">
 
             <h4>Contents</h4>
 
             <h4>Contents</h4>
 
             <ol>
 
             <ol>
                <!--Wiki indexes go here-->
 
 
             </ol>
 
             </ol>
 
         </div>
 
         </div>
         <div id="content-body">
+
         <div id="content-body"><div>
            <!--Wiki content goes here-->
+
<div id="intro" style="height:calc(66.66vw + 130px);index:100;position:absolute;top:0;left:0;background:inherit;transition:opacity .5s;">
         </div>
+
<h1 data-typer='"Iron deficiency affects more people than <b>any</b> other condition, constituting a public health condition of epidemic proportions" - <b>WHO</b>' data-delay="0"></h1>
 +
<h1 data-typer="Almost <b>30%</b> of the global population suffers from iron deficiency anaemia."data-delay="11000"></h1>
 +
<h1 data-later="Our project, ioniron, aims to tackle this problem." style="display:none"></h1>
 +
</div>
 +
<style id="homestyles">
 +
.JC #content-container{
 +
visibility:visible!important;}
 +
.JC #content-index{
 +
display:none!important}
 +
.JC #content-body{margin:0px;}
 +
div.JC{
 +
transition:background-color 1s ease-in;
 +
background-color:#111!important;
 +
}
 +
#Header{
 +
opacity:0;
 +
transition:opacity 1s ease;
 +
}
 +
#Footer{
 +
opacity:0
 +
}
 +
#intro>h1,#intro>h1>b{
 +
text-align:left;
 +
border:none!important;
 +
font-size:40px!important;
 +
line-height:68.1167px!important;
 +
font-family:'Open Sans'!important;
 +
color:#bbb;
 +
margin:0!important;
 +
transition:color 1s ease-in;
 +
}
 +
#intro>h1>b{
 +
font-weight:400!important;
 +
color:#ff6427;
 +
}
 +
[data-typer]:after,[data-later]:after {
 +
  content:"";
 +
  display: inline-block;
 +
  vertical-align: middle;
 +
  width:1px;
 +
  height:1em;
 +
  background: #bbb;
 +
          animation: caretPulsate 1s linear infinite;
 +
  -webkit-animation: caretPulsate 1s linear infinite;
 +
}
 +
[data-typer]~[data-typer]:after{
 +
width:0;
 +
animation:none;
 +
-webkit-animation:none;
 +
}
 +
@keyframes caretPulsate {
 +
  0%  {opacity:1;}
 +
  50%  {opacity:1;}
 +
  60%  {opacity:0;}
 +
  100% {opacity:0;}
 +
}
 +
@-webkit-keyframes caretPulsate {
 +
  0%  {opacity:1;}
 +
  50%  {opacity:1;}
 +
  60%  {opacity:0;}
 +
  100% {opacity:0;}
 +
}
 +
</style>
 +
<link href="https://fonts.googleapis.com/css?family=Open+Sans:400" rel="stylesheet">
 +
<script>
 +
setTimeout(function(){
 +
qsa = document.querySelectorAll.bind(document);
 +
  var pauseMax = 80,
 +
    pauseMin = 40,
 +
    cht = 0;
 +
qsa("[data-typer]").forEach(
 +
function(e,i){setTimeout(function typeItt() {
 +
    if (cht > e.dataset.typer.length)return;
 +
    if(e.dataset.typer[cht]!="<")
 +
    e.innerHTML = e.dataset.typer.substring(0, cht++);
 +
    else e.innerHTML=e.dataset.typer.substring(0, cht+=3);
 +
    setTimeout(typeItt, ~~(Math.random() * (pauseMax - pauseMin + 1) + pauseMin));
 +
},e.dataset.delay);
 +
if(qsa("[data-typer]").length > i+1)
 +
  setTimeout(function(){
 +
    e.removeAttribute("data-typer");
 +
    cht=0
 +
},qsa("[data-typer]")[i+1].dataset.delay-10);
 +
});
 +
var ch=0;
 +
function typeIt() {
 +
            if (ch > qs("[data-later]").dataset.later.length){ setTimeout(function(){qs("#intro").style.opacity = "0"; qs("#afterintro").style.opacity="1";setTimeout(function(){qs("#intro").remove();
 +
makeBSS(".homeshow");},500);},1000); return;}
 +
            if (qs("[data-later]").dataset.later[ch] != "<")
 +
                qs("[data-later]").innerHTML = qs("[data-later]").dataset.later.substring(0, ch++);
 +
            else qs("[data-later]").innerHTML = qs("[data-later]").dataset.later.substring(0, ch += 3);
 +
            setTimeout(typeIt, ~~ (Math.random() * (pauseMax - pauseMin + 1) + pauseMin));
 +
         }
 +
setTimeout(function() {
 +
    qs("#Header").style.opacity = "1";
 +
qs("#Footer").style.opacity = "1";
 +
    qs("div.JC").style.cssText += 'background-color:#FFF !important';
 +
    qsa(".JC #intro h1:not([data-later]), .JC #intro h1:not([data-later]) b").forEach(function(e) {
 +
        e.style.color = "#FFF"
 +
    });
 +
    setTimeout(function() {
 +
        qsa(".JC #intro h1:not([data-later]), .JC #intro h1:not([data-later]) b").forEach(function(e) {
 +
            e.style.display = "none"
 +
        });
 +
        qs("[data-later]").style.cssText = "display:inline!important;color:#2764ff";
 +
 
 +
        typeIt();
 +
    }, 1000);
 +
}, (178 + 71) * 65 + (2 * 1500));
 +
},500);
 +
</script>
 +
<div id="afterintro" style="opacity:0;transition:opacity 1s;">
 +
<div id="slides">
 +
        <img class="slide showing" src="https://static.igem.org/mediawiki/2017/9/9c/Judd_UK_slideshow1.jpg"/>
 +
        <img class="slide" src="https://static.igem.org/mediawiki/2017/9/97/Judd_UK_slideshow2.jpg"/>
 +
        <img class="slide" src="https://static.igem.org/mediawiki/2017/9/94/Judd_UK_slideshow3.jpg"/>
 +
        <img class="slide" src="https://static.igem.org/mediawiki/2017/6/6d/Judd_UK_slideshow4.jpg"/>
 +
        <img class="slide" src="https://static.igem.org/mediawiki/2017/4/48/Judd_UK_slideshow5.jpg"/>
 +
        <img class="slide" src="https://static.igem.org/mediawiki/2017/0/09/Judd_UK_slideshow6.jpg"/>
 +
        <img class="slide" src="https://static.igem.org/mediawiki/2017/c/c5/Judd_UK_slideshow7.jpg"/>
 +
        <img class="slide" src="https://static.igem.org/mediawiki/2017/a/a7/Judd_UK_slideshow8.jpg"/>
 +
        <img class="slide" src="https://static.igem.org/mediawiki/2017/8/8d/Judd_UK_slideshow9.jpg"/>
 +
</div>
 +
<div id="real-content" style="margin-left:20px;margin-right:20px;padding-top:calc(66.666vw + 37px);">
 +
</div>
 +
</div>
 +
</div></div>
 
     </div>
 
     </div>
 
     <footer id="Footer">
 
     <footer id="Footer">
         <p>Copyright &copy; 2017 Aleksandur Murfitt
+
         <h4>Created by <a style="color:inherit" href="mailto:11murfitta@judd.kent.sch.uk">Aleksandur Murfitt</a>, content by the Judd_UK team</h4>
        </p>
+
 
     </footer>
 
     </footer>
 
     <template></template>
 
     <template></template>
 
     <div id="content-template" style="display:none"></div>
 
     <div id="content-template" style="display:none"></div>
 
</div>
 
</div>
 
 
</html>
 
</html>

Latest revision as of 22:18, 1 November 2017

Contents