想做一个回馈用户的优惠抽奖···············································
参考代码学习模仿:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Nearth</title>
<style type="text/css">
body{
background-image: url(0.jpg);
background-repeat: no-repeat;
background-attachment: fixed;
background-size: 100% 100%;
}
</style>
<script src="jquery-3.3.1.min.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
var imgs=[
"1.jpeg",
"2.jpeg",
"3.jpeg",
"4.jpeg",
"5.jpeg",
"6.jpeg",
"7.jpeg",
"8.jpeg",
];
var startid;
var index;
$(function(){
$("#startID").prop("disabled",false);
$("#stopID").prop("disabled",true);
$("#startID").click(function(){
startid=setInterval(function(){
$("#startID").prop("disabled",true);
$("#stopID").prop("disabled",false);
index=Math.floor(Math.random()*8);
$("#imgID1").prop("src",imgs[index]);
},50);
});
$("#stopID").click(function(){
$("#startID").prop("disabled",false);
$("#stopID").prop("disabled",true);
clearInterval(startid);
$("#imgID2").prop("src",imgs[index]).hide();
$("#imgID2").show("slow");
});
});
</script>
</head>
<body>
<h1>抽老婆游戏(抽奖)</h1>
<hr >
<div id="">
<img id="imgID1"src="1.jpeg" style="width:60px;height: 60px;">
</div>
<hr >
<input type="button" name="" id="startID" value="点击开始" style="width:100px;height: 100px"/>
<input type="button" name="" id="stopID" value="点击结束" style="width:100px;height: 100px"/>
<hr >
<div id="">
<img id="imgID2"src="1.jpeg" style="width:200px;height: 200px;">
</div>
</body>
</html>
运行结果:
注意:资源代码放在我的下载包里,感兴趣的自己去下载··············