基本信息
源码名称:jq 转盘抽奖 示例代码
源码大小:2.22KB
文件格式:.html
开发语言:Java
更新时间:2014-10-26
友情提示:(无需注册或充值,赞助后即可获取资源下载链接)
嘿,亲!知识可是无价之宝呢,但咱这精心整理的资料也耗费了不少心血呀。小小地破费一下,绝对物超所值哦!如有下载和支付问题,请联系我们QQ(微信同号):813200300
本次赞助数额为: 2 元×
微信扫码支付:2 元
×
请留下您的邮箱,我们将在2小时内将文件发到您的邮箱
源码介绍
<!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 http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>jquery仿各大商城网站圆形转盘抽奖活动</title>
<meta name="description" content="jquery仿各大商城网站圆形转盘抽奖活动,淘宝商城圆形转盘抽奖活动、天猫商城圆形转盘抽奖活动、京东商城圆形转盘抽奖活动等。" />
</head>
<body>
<style type="text/css">
*{margin:0;padding:0;list-style-type:none;}
a,img{border:0;}
body{font:12px/180% Arial, Helvetica, sans-serif, "新宋体";}
/* lottery */
#lottery{background:url("images/disc-bg.gif") no-repeat;position:relative;height:450px;width:450px;margin:40px auto;}
#lottery .image{position:absolute;left:47px;top:47px;width:352px;height:352px;}
#lottery .arrow{background:url("images/arrow.png") no-repeat;height:191px;left:207px;position:absolute;top:91px;width:32px;}
#lottery .arrow{_background:none;_filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale, src='images/arrow.png');}
#lottery .lot-btn{height:92px;left:177px;overflow:hidden;position:absolute;top:181px;width:91px;}
#lottery .lot-btn span{cursor:pointer;display:block;height:92px;position:relative;width:91px;}
#lottery .first span{background:url("images/buttons_01.png") no-repeat;}
#lottery .first span{_background:none;_filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale, src='images/buttons_01.png');}
</style>
<div id="lottery">
<img id="imgs" src="images/disc-rotate.gif" viewbox="0 0 352 30" class="image" />
<div class="arrow"></div>
<div class="lot-btn first">
<span></span>
</div>
</div>
<script type="text/javascript" src="js/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="js/jQueryRotate.2.2.js"></script>
<script type="text/javascript">
$(function(){
$(".lot-btn").click(function(){
for(var i = 0; i <= 10000; i ){
$("#imgs").rotate({
animateTo: i,
duration: 10000
});
if (i >= 3162){ //设置转盘停位置
break;
}
}
})
});
</script>
</body>
</html>