<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>My cat wants to kill me</title>
<link href="style.css" rel="stylesheet" type="text/css">
</head>
<body>
<div>
<input type="button" onclick="demoVisibility()" value="click to see stuff" height="50" class="button"/>
<input type="button" onclick="showslow()" value="haha" height="100"/>
<input type="button" onclick="stopPlay()" value="Stop the Music" height="100"/>
</div>
<audio id="id-audio" controls preload hidden>
<source src="Audio/Sad Satan2.aac" type="audio/aac">
Your browser does not support this audio format.
</audio>
<img id="id8" src="Images/cat.png" height="562.2" class="cat" alt=""/>
<img src="Images/copyeyes.png" height="60px" onclick="this.src='Images/eyes.png'" class="eyes" alt="" />
<img src="Images/Untitled-1_0007_My-cat-is-a-good-boy.-A-very-good-boy-indeed.---.png" height="35px" class="good-boy" alt=""/>
<img id="id2" src="Images/Untitled-1_0006_He-is-very-smart.-and-always-hungry.-.png" height="35" class="smart-boy" alt=""/>
<img id="id3" src="Images/Untitled-1_0005_A-month-ago-he-escaped-from-the-house,-and-when-he-comes-back,-.png" class="escape-boy" height="70" alt=""/>
<img id="id4" src="Images/Untitled-1_0004_I-think-he-was-in-another-dimension..png" class="dimension-boy" height="30" alt=""/>
<img id="id5" src="Images/Untitled-1_0003_Because-now-when-I-look-in-his-eyes.png" class="look-boy" height="35" alt=""/>
<img id="id6" src="Images/FIRE_0002_I-SEE-AN-ENDLESS-FIRE-OF..png" class="fire-boy" height="30" alt=""/>
<img id="id7" src="Images/_0001_A--FIRE.FIRE.-F.I.R.E.---..OF..-A.F.I.R.E..F.I.R.E.-O.F...I.R.E..png" height="300" class="afire" alt=""/>
<img id="id9" src="Images/0000---HELL.png" height="300" class="afire2" alt=""/>
<img src="Images/MOSHED-2021-10-17-4-44-40.gif" width="2650" height="1300" class="glitch" alt=""/>
<script>
i=2;
function demoVisibility(){
if(i == 2) {
document.getElementById("id-audio").play();
}
document.getElementById("id"+i++).style.visibility="visible";
}
function stopPlay(){
document.getElementById("id-audio").pause();
}
function visible2(){
document.getElementById("id9").style.visibility="visible";
}
(function(){
var oImg = document.getElementById("id9");
var alpha = 30;
oImg.onmouseover = function(){show(100,5) ;}
oImg.onmouseout = function(){show(30,-5); }
var handler = null;
function show(target,speed){
clearInterval(handler);
handler = setInterval(function(){
if(alpha == target){
clearInterval(handler);
}
else {
alpha+=speed;
oImg.style.opacity = alpha/100;
oImg.style.filter = 'alpha(opacity:' + alpha +')';
}
},60)
}
})()
</script>
</body>
</html>
@charset "utf-8";
body
{padding:0;
margin:0;}
img
{position: absolute}
.cat
{left: 1500px;
top:670px;
visibility: hidden;}
.eyes
{left: 1983px;
top: 808px;}
.button
{left:50%;
top:50%;
position:fixed;}
.good-boy
{left:0px;
top:50px;}
.smart-boy
{left:80px;
top:150px;
visibility: hidden;}
.escape-boy
{left:130px;
top:250px;
visibility: hidden;}
.dimension-boy
{left:230px;
top:300px;
visibility: hidden;}
.look-boy
{left:260px;
top:400px;
visibility: hidden;}
.fire-boy
{left:560px;
top:600px;
visibility: hidden;}
.afire
{left:900px;
top:620px;
visibility: hidden;}
.afire2
{left:600px;
top:690px;
visibility: hidden;}
.glitch
{visibility: hidden;}
网友评论