Created
May 5, 2014 07:32
-
-
Save spara/e7e53d5339f1203976f8 to your computer and use it in GitHub Desktop.
Src for big with ignite style timer
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<html> | |
<head> | |
<title></title> | |
<meta charset="utf-8" /> | |
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" /> | |
<style type='text/css'> | |
body { | |
background:#000; | |
color:#fff; | |
font-family:'Georgia'; | |
-webkit-transform:rotate(-4deg) scale(0.9); | |
} | |
h1, h2, h3, p { | |
margin:0; | |
} | |
@-webkit-keyframes blinker { | |
from { opacity: 1.0; } | |
to { opacity: 0.0; } | |
} | |
em { | |
-webkit-animation-name: blinker; | |
-webkit-animation-iteration-count: infinite; | |
-webkit-animation-timing-function: cubic-bezier(1.0,0,0,1.0); | |
-webkit-animation-duration: 800ms; | |
} | |
a { | |
background: #34d0e7; | |
color:#000; | |
text-decoration:none; | |
} | |
img { | |
max-width:75%; | |
max-height:75%; | |
} | |
div { | |
cursor:pointer; | |
cursor:hand; | |
vertical-align:middle; | |
position:absolute; | |
top:0; | |
left:0; | |
} | |
</style> | |
<script type='text/javascript'> | |
window.onload = function() { | |
var s = document.getElementsByTagName('div'), cur = 0; | |
if (!s) return; | |
function go(n) { | |
cur = n; | |
var i = 1e3, e = s[n]; | |
for (var k = 0; k < s.length; k++) s[k].style.display = 'none'; | |
e.style.display = 'inline'; | |
e.style.fontSize = i + 'px'; | |
if (e.firstChild.nodeName === 'IMG') { | |
document.body.style.backgroundImage = 'url(' + e.firstChild.src + ')'; | |
e.firstChild.style.display = 'none'; | |
} else { | |
document.body.style.backgroundImage = ''; | |
document.body.style.backgroundColor = e.style.backgroundColor; | |
} | |
while ( | |
e.offsetWidth > window.innerWidth || | |
e.offsetHeight > window.innerHeight) { | |
e.style.fontSize = (i -= 10) + 'px'; | |
if (i < 0) break; | |
} | |
e.style.marginTop = ((window.innerHeight - e.offsetHeight) / 2) + 'px'; | |
if (window.location.hash !== n) window.location.hash = n; | |
document.title = e.textContent || e.innerText; | |
} | |
document.onclick = function() { | |
go(++cur % (s.length)); | |
}; | |
document.onkeydown = function(e) { | |
(e.which === 39) && go(Math.min(s.length - 1, ++cur)); | |
(e.which === 37) && go(Math.max(0, --cur)); | |
}; | |
function parse_hash() { | |
return Math.max(Math.min( | |
s.length - 1, | |
parseInt(window.location.hash.substring(1), 10)), 0); | |
} | |
if (window.location.hash) cur = parse_hash() || cur; | |
window.onhashchange = function() { | |
var c = parse_hash(); | |
if (c !== cur) go(c); | |
}; | |
setInterval(function() { | |
var e = document.createEvent("Events"); | |
e.initEvent("click"); | |
document.dispatchEvent(e) }, 15000) | |
go(cur); | |
}; | |
</script> | |
</head> | |
<body> | |
<div>Open as in <em>Goatse</em></div> | |
<div><img src="./img/coolface-trollface-trolls-faces.png"><em>Trollin'</em></div> | |
<div>gratis vs libre<p> | |
<img src='./img/freebeer.jpeg' width="400" height="300"/> vs <img src='./img/alex_jones_nerds.png' width="400" height="300"/> | |
</div> | |
<div>open ...source ...data ...systems ...standards ...knowledge ...content ...access ...government </div> | |
<div>characteristics of open</div> | |
<div>no <img src="./img/audi_goatse.jpg"> restrictions on use</div> | |
<div>you can see if it works<br> | |
<img src="./img/reaction.jpeg" vertical-align="middle";> | |
</div> | |
<div>redistribute <img src="./img/2012_olympics.jpg">it in any manner</div> | |
<div>you can <img src="./img/find-the-hero-inside-of-you-photo-u1.jpg">improve it</div> | |
<div> <img src="./img/anil.184.jpg">opportune</div> | |
<div>processable by machine<p><p> <img src="./img/comparison.jpg"></div> | |
<div>fundamental<br><p> <img src="./img/goetzche.jpg" style="float:center"></div> | |
<div>no owner<br> <img src="./img/security.png"></div> | |
<div>complete<p> <img src="./img/goatse-cookies.jpg"></div> | |
<div>accessible <img src="./img/the-goatse-carousel-photo-u1.jpg"></div> | |
<div>not discriminatory<p> <img src="./img/career.jpg"></div> | |
<div>no licenses<p><img src="./img/the-disney-goatse-camera-photo-u1.jpg"> <img src="./img/the-disney-goatse-clock-photo-u1.jpg"></div> | |
<div> <img src="./img/the-breville-sandwich-maker-goatse-photo-u1.jpg"> » <img src="./img/brevilleman.png"></div> | |
<div>Goatse is a durable meme that exhibits characteristics of openess.</div> | |
<div>Walking the walk.<p> | |
Tom Macwright: <a href="https://github.com/tmcw/big">big</a>. <em>@tmwcv</em><p> | |
Max Ogden: js timer snippet. <em>@maxogdon</em> | |
</div> | |
<body> | |
</html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment