dela v osnovi
commit
012487bf64
Binary file not shown.
|
@ -0,0 +1,108 @@
|
||||||
|
var zaporedje = [
|
||||||
|
{
|
||||||
|
tip: "tekst",
|
||||||
|
vsebina: "neprekinjeno",
|
||||||
|
len: 0.5,
|
||||||
|
pavza: 0.1
|
||||||
|
},
|
||||||
|
{
|
||||||
|
tip: "tekst",
|
||||||
|
vsebina: "nizanje",
|
||||||
|
len: 0.5,
|
||||||
|
pavza: 0.1
|
||||||
|
},
|
||||||
|
{
|
||||||
|
tip: "tekst",
|
||||||
|
vsebina: "istih",
|
||||||
|
len: 0.5,
|
||||||
|
pavza: 0.1
|
||||||
|
},
|
||||||
|
{
|
||||||
|
tip: "tekst",
|
||||||
|
vsebina: "glasov",
|
||||||
|
len: 0.5,
|
||||||
|
pavza: 0.5
|
||||||
|
},
|
||||||
|
{
|
||||||
|
tip: "tekst",
|
||||||
|
vsebina: "je",
|
||||||
|
len: 0.2,
|
||||||
|
pavza: 0.1
|
||||||
|
},
|
||||||
|
{
|
||||||
|
tip: "tekst",
|
||||||
|
vsebina: "dobesedno",
|
||||||
|
len: 0.666,
|
||||||
|
pavza: 0.1
|
||||||
|
},
|
||||||
|
{
|
||||||
|
tip: "tekst",
|
||||||
|
vsebina: "slušni",
|
||||||
|
len: 0.5,
|
||||||
|
pavza: 0.1
|
||||||
|
},
|
||||||
|
{
|
||||||
|
tip: "tekst",
|
||||||
|
vsebina: "dražljaj",
|
||||||
|
len: 0.666,
|
||||||
|
pavza: 0.3
|
||||||
|
},
|
||||||
|
{
|
||||||
|
tip: "strobe",
|
||||||
|
len: 4,
|
||||||
|
interval: 0.05,
|
||||||
|
pavza: 3
|
||||||
|
}
|
||||||
|
];
|
||||||
|
|
||||||
|
document.addEventListener('DOMContentLoaded', function () {
|
||||||
|
stevec = 0;
|
||||||
|
barva = true;
|
||||||
|
crka_el = document.getElementById("crka");
|
||||||
|
body_el = document.body;
|
||||||
|
|
||||||
|
function zamenjajBarve() {
|
||||||
|
if (barva) {
|
||||||
|
body_el.style.backgroundColor = "white";
|
||||||
|
crka_el.style.color = "black";
|
||||||
|
} else {
|
||||||
|
body_el.style.backgroundColor = "black";
|
||||||
|
crka_el.style.color = "white";
|
||||||
|
}
|
||||||
|
barva = !barva;
|
||||||
|
}
|
||||||
|
|
||||||
|
function predvajajKos(kos) {
|
||||||
|
if (kos.tip === "tekst") {
|
||||||
|
var crka_interval = kos.len / kos.vsebina.length;
|
||||||
|
kos.vsebina.split("").map(function(crka) {
|
||||||
|
setTimeout(function () {
|
||||||
|
zamenjajBarve();
|
||||||
|
crka_el.innerHTML = crka;
|
||||||
|
}, stevec * 1000);
|
||||||
|
stevec += crka_interval;
|
||||||
|
});
|
||||||
|
} else if (kos.tip === "strobe") {
|
||||||
|
setTimeout(function () {
|
||||||
|
crka_el.innerHTML = "";
|
||||||
|
}, stevec * 1000);
|
||||||
|
|
||||||
|
for (i = 0; i < kos.len; i += kos.interval) {
|
||||||
|
setTimeout(function () {
|
||||||
|
zamenjajBarve();
|
||||||
|
}, stevec * 1000);
|
||||||
|
stevec += kos.interval;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
stevec += kos.pavza;
|
||||||
|
}
|
||||||
|
|
||||||
|
function zacetek () {
|
||||||
|
zaporedje.map(predvajajKos);
|
||||||
|
|
||||||
|
setTimeout(zacetek, stevec);
|
||||||
|
}
|
||||||
|
|
||||||
|
setTimeout(zacetek, 2000);
|
||||||
|
});
|
|
@ -0,0 +1,29 @@
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<title>Fingernails on a chalkboard</title>
|
||||||
|
<style type="text/css">
|
||||||
|
html,body {
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
body {
|
||||||
|
margin: 0;
|
||||||
|
background-color: black;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
user-select: none;
|
||||||
|
cursor: none;
|
||||||
|
}
|
||||||
|
#crka {
|
||||||
|
color: white;
|
||||||
|
font-family: Courier;
|
||||||
|
font-size: 12rem;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
<script src="animacija.js" type="text/javascript"></script>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<span id="crka"></span>
|
||||||
|
</body>
|
||||||
|
</html>
|
Loading…
Reference in New Issue