<!DOCTYPE html>
<html lang="tr">
<head>
<!-- HTML -->
<!-- Custom Styles -->
body{
background-color: yellow;
}
t{
top: 100px;
left: 50%;
position: absolute;
font-size: 100px;
font-weight: bold;
font-family: 'Courier New', Courier, monospace;
text-shadow: 2px 2px 10px #B2B2B2
}
g{
top: 10px;
left: 50%;
position: absolute;
font-size: 50px;
font-family: Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;
}
</head>
<body id="body">
<!-- Project -->
<g id="g"></g>
<t id="t"></t>
<!--ECMA Script -->
function id(id) {
return document.getElementById(id);
}
function turn(fx,FPS) {
setInterval(function(){
fx();
},1000/FPS)
}
const t = id("t");
const body = id("body")
var cahal = {
speed: 3,
x: 0,
y: 0
}
turn(function(){
t.style.top = cahal.x + 'px';
cahal.x += cahal.speed;
t.style.left = cahal.y + 'px';
cahal.y += cahal.speed;
if (cahal.x>=window.innerWidth-300&&cahal.y>=window.innerHeight-300) {
cahal.speed = -3;
} else
if (cahal.x<50&&cahal.y<50) {
cahal.speed = 3;
}
},60)
const colors = ['black','red','green','blue','yellow','brown','pink']
const colors2 = ['#39F5FF','#39FF93','#FFA60A','#FFA60A','#FF8484','#84FFCE','#DB84FF']
turn(function(){
var e = Math.floor(Math.random()*colors.length);
t.style.color = colors[e];
},1)
setInterval(function(){
var e2 = Math.floor(Math.random()*colors2.length);
body.style.backgroundColor = colors2[e2]
},2000)
</body>
</html>
![Uzay Çalışmalarının Önemi - Süleyman Fişek [Röportaj]](https://fizikist.com/uploads/img/uzay-calismalarinin-onemi.jpg "Uzay Çalışmalarının Önemi - Süleyman Fişek [Röportaj]")