<!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; color: white; } .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() { await sleep(2500); hide("rickroll"); show("psyche"); set_title("PSYCHE"); set_bg("#136602"); await sleep(3000); hide("psyche"); show("shill"); set_title("i like it a lot :]"); set_bg("#008282"); 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> <p> that's all there's definitely no trick nor time pressure to clicking these links </p> <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>