2023-08-19 23:49:19 -04:00
|
|
|
<!DOCTYPE html>
|
|
|
|
|
<html lang="en">
|
|
|
|
|
<head>
|
|
|
|
|
<meta charset="UTF-8" />
|
|
|
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
|
|
|
<title>RICK ROLL OF COURSE</title>
|
|
|
|
|
<style>
|
|
|
|
|
* {
|
|
|
|
|
margin: 0;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
body {
|
|
|
|
|
width: 100vw;
|
|
|
|
|
height: 100vh;
|
|
|
|
|
background-color: #a4a3ae;
|
|
|
|
|
transition: 1s background-color;
|
2023-08-20 07:45:29 -04:00
|
|
|
color: white;
|
2023-08-19 23:49:19 -04:00
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.absolute-center {
|
|
|
|
|
position: absolute;
|
|
|
|
|
top: 50%;
|
|
|
|
|
left: 50%;
|
|
|
|
|
transform: translate(-50%, -50%);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.initially-hidden {
|
|
|
|
|
display: none;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
#lemonsnout {
|
|
|
|
|
animation: explode 3s ease-in;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
@keyframes explode {
|
|
|
|
|
0% {
|
|
|
|
|
transform: scale(0%);
|
|
|
|
|
}
|
|
|
|
|
100% {
|
|
|
|
|
transform: scale(100%);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
</style>
|
|
|
|
|
<script>
|
|
|
|
|
function sleep(ms) {
|
|
|
|
|
return new Promise(resolve => setTimeout(resolve, ms));
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function hide(id) {
|
|
|
|
|
document.getElementById(id).style.display = "none";
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function show(id) {
|
|
|
|
|
document.getElementById(id).style.display = "block";
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function set_bg(color) {
|
|
|
|
|
document.body.style.backgroundColor = color;
|
|
|
|
|
}
|
|
|
|
|
function set_title(title) {
|
|
|
|
|
document.title = title;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
async function main() {
|
2023-08-20 08:37:11 -04:00
|
|
|
await sleep(2500);
|
2023-08-19 23:49:19 -04:00
|
|
|
hide("rickroll");
|
|
|
|
|
show("psyche");
|
|
|
|
|
set_title("PSYCHE");
|
|
|
|
|
set_bg("#136602");
|
|
|
|
|
|
|
|
|
|
await sleep(3000);
|
|
|
|
|
hide("psyche");
|
|
|
|
|
show("shill");
|
|
|
|
|
set_title("i like it a lot :]");
|
2023-08-20 07:45:29 -04:00
|
|
|
set_bg("#008282");
|
2023-08-19 23:49:19 -04:00
|
|
|
|
|
|
|
|
await sleep(10000);
|
|
|
|
|
hide("shill");
|
|
|
|
|
show("2x-psyche");
|
|
|
|
|
set_title("OHHHHHHH YOU JUST GOT GOT");
|
|
|
|
|
set_bg("#b57fc4");
|
|
|
|
|
|
|
|
|
|
await sleep(1000);
|
|
|
|
|
show("lemonsnout-container");
|
|
|
|
|
set_title("oh hi lemonsnout :D");
|
|
|
|
|
|
|
|
|
|
await sleep(3200);
|
|
|
|
|
window.location.replace(
|
|
|
|
|
"https://www.youtube.com/watch?v=dQw4w9WgXcQ"
|
|
|
|
|
);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
window.onload = main;
|
|
|
|
|
</script>
|
|
|
|
|
</head>
|
|
|
|
|
<body>
|
|
|
|
|
<img
|
|
|
|
|
id="rickroll"
|
|
|
|
|
class="absolute-center"
|
|
|
|
|
src="https://media.tenor.com/x8v1oNUOmg4AAAAd/rickroll-roll.gif"
|
|
|
|
|
alt="young rick astley from the famous rick roll dancing"
|
|
|
|
|
/>
|
|
|
|
|
<img
|
|
|
|
|
id="psyche"
|
|
|
|
|
class="absolute-center initially-hidden"
|
|
|
|
|
src="./psyche.png"
|
|
|
|
|
alt="large, green, pixelated text that says PSYCHE"
|
|
|
|
|
/>
|
|
|
|
|
<div id="shill" class="absolute-center initially-hidden">
|
|
|
|
|
<p>i just want you to read homestuck :]</p>
|
2023-08-20 08:37:11 -04:00
|
|
|
<p>
|
|
|
|
|
that's all there's definitely no trick nor time pressure to
|
|
|
|
|
clicking these links
|
|
|
|
|
</p>
|
2023-08-19 23:49:19 -04:00
|
|
|
<a href="https://bambosh.dev/unofficial-homestuck-collection"
|
|
|
|
|
>offline (best)</a
|
|
|
|
|
>
|
|
|
|
|
<a href="https://homestuck.giovanh.com"
|
|
|
|
|
>online (easier, also really cool)</a
|
|
|
|
|
>
|
|
|
|
|
</div>
|
|
|
|
|
<img
|
|
|
|
|
id="2x-psyche"
|
|
|
|
|
class="absolute-center initially-hidden"
|
|
|
|
|
src="./x2-double-psycheout-combo.png"
|
|
|
|
|
alt="large, yellow and purple, pixelated text that says x2 DOUBLE PSYCHEOUT COMBO!!"
|
|
|
|
|
/>
|
|
|
|
|
<div class="absolute-center initially-hidden" id="lemonsnout-container">
|
|
|
|
|
<img
|
|
|
|
|
id="lemonsnout"
|
|
|
|
|
src="./large-lemonsnout.png"
|
|
|
|
|
alt="a very close pic of lemonsnout's head"
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
</body>
|
|
|
|
|
</html>
|
