metanohi-misc-subsites/old-projects/x/eyekiller.htm

109 lines
1.8 KiB
HTML
Raw Normal View History

2011-08-02 19:57:57 +02:00
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3c.org/1999/xhtml">
<head>
<title>Eyekiller</title>
<style type='text/css'>
* {
padding:0;
margin:0
}
body {
background:#0094ff url(eyekiller/bg.png);
}
#game {
position:absolute;
left:50%;
top:50%;
margin-left:-320px;
margin-top:-200px;
width:640px;
height:400px;
border:2px solid #000;
background-image:url(eyekiller/gbg.png);
background-repeat:no-repeat;
background-position:0 0;
}
#game.g1 {background-position:0 0}
#game.g2 {background-position:0 -400px}
#game.g3 {background-position:0 -800px}
#game.g4 {background-position:0 -1200px}
#game.g5 {background-position:0 -1600px}
#car {
position:absolute;
bottom:20px;
right:20px;
width:140px;
height:89px;
background:url(eyekiller/car.png) no-repeat;
display:none;
}
#car.show {
display:block;
}
</style>
<script type='text/javascript'>
s=20
g=1
b=1
cr=false
function ani() {
s=(s-20)*(-1)+25
car.style.bottom=s+"px"
at=setTimeout("ani()",150)
}
function bgani() {
if (g<5) g++
else g=1
game.className="g"+g
bt=setTimeout("bgani()",50)
}
function bgbgani() {
d.style.backgroundPosition=b+"px -"+b+"px"
b++
bbt=setTimeout("bgbgani()",10)
}
function clck() {
if (!cr) {
cr=true
car.className="show"
ani()
bgbgani()
}
else {
cr=false
car.className=""
clearTimeout(at)
clearTimeout(bbt)
}
}
function load() {
document.title+=" :: Click on screen to see a moving background and a car"
game=document.getElementById("game")
car=document.getElementById("car")
d=document.body
bgani()
}
window.onload=load
document.onclick=clck
</script>
</head>
<body>
<div id='game'>
<div id='car'></div>
</div>
</body>
</html>