<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>抽奖</title>
<meta http-equiv="Content-Type" content="text/html; charset=GB2312" />
<style type="text/css">
#lp{
width:600px;
height:600px;
background-image: url(plate_06.png);
margin:0 auto;
z-index: 9;
}
#button{
background-image: url(plate_04.png);
background-position: 0 0px;
z-index: 10;
position:absolute;
top:228px;
left: 594px;;
width:150px;
height: 150px;
cursor: pointer;
}
#gl{
height:592px;
width:592px;
background:url('plate_05.png') left top;
background-repeat: no-repeat;
background-position: 0 0px;
margin:0 auto;
position: absolute;
top: 8px;
left: 380px;
border: solid 1px;
}
</style>
</head>
<body>
<div id="lp">
</div>
<div id="button"></div>
<div id='gl'>
<img src="plate_03.png" />
</div>
<script type="text/javascript">
var count = 1 ;
var sz ;
var stop;
var sum = 1;
function countAward(){
var award = [
'5M 永久空间',
'80M 永久空间',
'1G 永久空间',
'200M 永久空间',
'100M 永久空间',
'20M 永久空间',
'继续攒人品',
'10G 永久空间',
'50M 永久空间',
'1T 永久空间',
]
return award[count-1];
}
function getRandom(n){
return Math.floor(Math.random()*n+1)
}
function setHeight(){
var height = -592;
var gl = document.getElementById('gl');
gl.style.backgroundPosition = '0'+''+height*count+'px';
count += 1;
sum += 1;
if(count === 11){
gl.style.backgroundPosition = '0 0';
count = 1;
}
if(sum === sz){
clearInterval(stop);
alert('恭喜您获得'+countAward());
}
}
function moveA(){
sz = getRandom(20);
alert(sz);
stop = setInterval(setHeight,300);
}
function init(){
var btn = document.getElementById( 'button' );
btn.addEventListener('mouseover',function(){
btn.style.backgroundPosition = '0 150px';
},false);
btn.addEventListener('mouseout',function(){
btn.style.backgroundPosition = '0 0px';
},false);
btn.addEventListener('click',moveA,false);
}
window.onload = init;
</script>
</body>
</html>
抽奖
最新推荐文章于 2022-08-23 17:07:41 发布