<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta name="viewport" content="width=640">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>实用jQuery大转盘抽奖特效代码 </title>
<meta name="Keywords" content="jQuery抽奖转盘,jQuery转盘抽奖,jQuery圆盘抽奖,jQuery抽奖插件,JS转盘抽奖,JS大转盘抽奖" />
<meta name="description" content="代码笔记提供高质量的抽奖转盘特效代码的学习和下载" />
<script type="text/javascript" src="js/jquery-1.8.2.min.js"></script>
<script type="text/javascript" src="js/jQueryRotate.js"></script>
<script type="text/javascript" src="js/script.js"></script>
<style type="text/css">
body{background:url(images/bg.png) 0 0 repeat;}
.rotate-con-pan{background:url(images/dropkick.jpg) no-repeat 0 0;background-size:100% 100%;position:relative;width:480px;height:480px;box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;margin:0 auto}
.rotate-con-zhen{width:112px;height:224px;background:url(images/start.png) no-repeat 0 0;background-size:100% 100%;cursor:pointer;position:absolute;left:180px;top:140px;}
</style>
</head>
<body>
<div class="rotate-con-pan">
<div class="rotate-con-zhen"></div>
</div>
<script type="text/javascript">
$(function(){
$(".rotate-con-zhen").rotate({
bind:{
click:function(){
var a = runzp();
$(this).rotate({
duration:3000, //转动时间
angle: 0, //起始角度
animateTo:1440+a.angle, //结束的角度
easing: $.easing.easeOutSine,//动画效果，需加载jquery.easing.min.js
callback: function(){
alert(a.prize+a.message);//简单的弹出获奖信息
}
});
}
}
});
});
</script>
</body>
</html>
