Difference between revisions of "Team:Judd UK/berhfudf"

Line 43: Line 43:
 
color:#ff6427;
 
color:#ff6427;
 
}
 
}
[data-typer]:after {
+
[data-typer]:after,[data-later]:after {
 
   content:"";
 
   content:"";
 
   display: inline-block;
 
   display: inline-block;
Line 109: Line 109:
 
<h1 data-typer='"Iron deficiency affects more people than any other condition, constituting a public health condition of epidemic proportions" - WHO' data-delay="0"></h1>
 
<h1 data-typer='"Iron deficiency affects more people than any other condition, constituting a public health condition of epidemic proportions" - WHO' data-delay="0"></h1>
 
<h1 data-typer="Over <b>30%</b> of the global population suffers from iron deficiency anaemia."data-delay="11000"></h1>
 
<h1 data-typer="Over <b>30%</b> of the global population suffers from iron deficiency anaemia."data-delay="11000"></h1>
 +
<h1 data-later="Here's what we're doing about it:" style="display:none"></h1>
 
  <link href="https://fonts.googleapis.com/css?family=Open+Sans:400,600" rel="stylesheet">  
 
  <link href="https://fonts.googleapis.com/css?family=Open+Sans:400,600" rel="stylesheet">  
 
<script>
 
<script>
Line 118: Line 119:
 
qsa("[data-typer]").forEach(
 
qsa("[data-typer]").forEach(
 
function(e,i){setTimeout(function typeItt() {
 
function(e,i){setTimeout(function typeItt() {
console.log(e);
 
 
     if (cht > e.dataset.typer.length)return;
 
     if (cht > e.dataset.typer.length)return;
 
     if(e.dataset.typer[cht]!="<")
 
     if(e.dataset.typer[cht]!="<")
Line 124: Line 124:
 
     else e.innerHTML=e.dataset.typer.substring(0, cht+=3);
 
     else e.innerHTML=e.dataset.typer.substring(0, cht+=3);
 
     setTimeout(typeItt, ~~(Math.random() * (pauseMax - pauseMin + 1) + pauseMin));
 
     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);
+
},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);
 
});
 
});
setTimeout(function(){qs("#Header").style.opacity = "1";qs("div.JC").style.cssText += 'background-color:#FFF !important'; qsa(".JC #content-container>div h1, .JC #content-container>div b").forEach(function(e){e.style.color="#FFF"});setTimeout(function(){qsa(".JC #content-container>div h1, .JC #content-container>div b").forEach(function(e){e.style.display="none"});},1000)},(178+71)*65 + (2 * 1500));
+
setTimeout(function(){qs("#Header").style.opacity = "1";qs("div.JC").style.cssText += 'background-color:#FFF !important'; qsa(".JC #content-container>div h1, .JC #content-container>div b").forEach(function(e){e.style.color="#FFF"});setTimeout(function(){qsa(".JC #content-container>div h1, .JC #content-container>div b").forEach(function(e){e.style.display="none"});function typeIt() {
 +
    if (ch > qs("[data-later]").dataset.later.length)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));
 +
}},1000);},(178+71)*65 + (2 * 1500));
 
},500);
 
},500);
 
</script>
 
</script>

Revision as of 21:32, 31 October 2017

Contents

Designed by Aleksandur Murfitt