metanohi-misc-subsites/projects/x/mm.htm

69 lines
1.3 KiB
HTML

<!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>Moving Man</title>
<style type='text/css'>
body {
background:#000;
}
#stage {
position:relative;
width:630px;
height:473px;
margin:0 auto;
background:#fff;
overflow:hidden;
}
#m {
position:absolute;
bottom:0;
left:0;
}
</style>
<script type='text/javascript'>
function begin() {
img1=new Image()
img1.src="m1.png"
img2=new Image()
img2.src="m2.png"
document.getElementById("stage").innerHTML="<img id='m' src='img/m1.png' alt='' />"
man()
manmove()
}
n=1
l=0
function man() {
document.getElementById("m").src="img/m"+n+".png"
if (n==1)
n=2
else
n=1
m=setTimeout("man()",100)
}
function manmove() {
document.getElementById("m").style.left=l+"px"
if (document.getElementById("m").style.left=="580px")
document.getElementById("m").className="y"
else if (document.getElementById("m").style.left=="0px")
document.getElementById("m").className=""
if (document.getElementById("m").className=="")
l=l+20
else
l=l-20
mm=setTimeout("manmove()",200)
}
window.onload=begin
</script>
</head>
<body>
<div id='stage'></div>
</body>
</html>