Animated Header Image. Using p5.js library.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset=utf-8/>
<link href='https://fonts.googleapis.com/css?family=Allerta+Stencil' rel='stylesheet' type='text/css'>
<script src="/libraries/p5.js"></script>
<script src="/libraries/p5.dom.js"></script>
<script>
var text;
var canvas;
i = 30;
function setup() {
text = createDiv("indiessance");
canvas = createCanvas(960, 150);
background(0);
text.position(i, 10);
text.style("font-family", "Allerta Stencil");
text.style("background-color", "#000000");
text.style("color", "#ffffff");
text.style("font-size", "72pt");
}
function draw() {
background(0);
text.position(i, 10);
text.style("color", "#ffffff");
i = i + random(350);
if (i > 350) {
i = 30;
}
frameRate(1);
}
</script>
</head><body> </body></html>