Pi Day
HTML
<div class="title">
Pi Day - 03.14.2017
</div>
CSS
body {
font-family: monospace;
background: #000;
color: green;
animation: glow 2s infinite ease;
font-size: 30px;
}
a {
animation: glow 2s infinite ease;
color: green;
}
.title {
width: 400px;
height: 100px;
padding-top: 25px;
box-sizing: border-box;
font-size: 20px;
text-align: center;
margin: 0 auto;
}
b {
color: #000;
}
.pie {
width: 510px;
height: 430px;
margin: 0 auto;
}
@keyframes glow{
0% {color: #ff0000;}
10% {color: #ff8000;}
20% {color: #ffff00;}
30% {color: #80ff00;}
40% {color: #00ff00;}
50% {color: #00ff80;}
60% {color: #00ffff;}
70% {color: #0080ff;}
80% {color: #0000ff;}
90% {color: #8000ff;}
100% {color: #ff0080;}
}
JAVASCRIPT
var pi = "3.141592653589793238462643383279502884197169399375105820974944592307816406286208998628034825342117067982148086513282306647093844609550582231725359408128481117450284102701938521105559644622948954930381964428810975665933446128475648233786783165271201909145648566923460348610454326648213393607260249141273724587006606315588174881520920962829254091715364367892590360011330530548820466521384146951941511609433057270365759591953092186117381932611793105118548";
var pos = 0;
function digit(b){
temp = "";
for(i=pos;i<b+pos;i++){
c = Math.random()+0.2;
document.write("<span style='opacity: "+c+";'>"+pi[i]+"</span>");
}
pos += b;
}
function br(){
document.write("<br>");
}
function space(b){
document.write("<b>");
for(i=pos;i<b+pos;i++){
document.write("#");
}
document.write("</b>");
}
function pieee(){
document.write("<div class='pie'>");
space(2);
digit(28);
br();
digit(30);
br();
digit(3);
space(5);
digit(5);
space(6);
digit(5);
br();
space(8);
digit(5);
space(6);
digit(5);
br();
space(8);
digit(5);
space(6);
digit(5);
br();
space(8);
digit(5);
space(6);
digit(5);
br();
space(8);
digit(5);
space(6);
digit(5);
br();
space(7);
digit(6);
space(6);
digit(5);
br();
space(7);
digit(6);
space(6);
digit(5);
br();
space(5);
digit(8);
space(6);
digit(5);
space(5);
digit(2);
br();
space(5);
digit(8);
space(8);
digit(5);
space(1);
digit(3);
br();
space(7);
digit(5);
space(10);
digit(7);
document.write("</div>");
}
pieee();