html抽奖原理,抽奖器html
1、环境要求:用html4配合javascript写的抽奖器,只要电脑上有浏览器就可以运行。
2、功能:支持在抽奖过程中,更换当前要抽奖的人数。
3、缺点:
a.当人数过多时,可能有性能问题。
b.未对输入的人数作校验。
源代码如下:
抽奖
function setlistitem(){
document.getElementById('rewardlist').innerHTML='';
document.getElementById('listdiv').innerHTML='';
narr=new Array();
var pnum=parseInt(document.getElementById('pn').value,10), seln=parseInt(document.getElementById('spn').value,10);
var selh=seln*31;
document.getElementById('rewardlist').style.height=selh+'px';
document.getElementById('maincon').style.height=selh+'px';
for (var i=1; i<=pnum; i++){narr.push(i);}
for (var i=1; i
var ri=parseInt(Math.random()*(pnum-i)+i,10);
var t=narr[ri];
narr[ri]=narr[i-1];
narr[i-1]=t;
}
drawlist();
}
function setbatch(){
var seln=parseInt(document.getElementById('spn').value,10);
var selh=seln*31;
document.getElementById('rewardlist').style.height=selh+'px';
document.getElementById('maincon').style.height=selh+'px';
document.getElementById('rewardlist').innerHTML='';
}
function drawlist(){
document.getElementById('listdiv').innerHTML='';
var bl = narr.length, tmparr = new Array();
for (var y=0;y<2;y++){
for (var i=0; i
tmparr.push(narr[i]);
}
}
var hs='';
for (var i=0; i
hs+='
';
}
document.getElementById('listdiv').innerHTML=hs;
document.getElementById('listdiv').style.marginTop='0px';
}
var scrollTime=null, scrollFlag=false, narr;
function scrollitem(){
if (scrollFlag){
scrollTime = setTimeout('scrollitem()',70);
}
var mh=parseInt(document.getElementById('listdiv').style.marginTop,10);
mh=mh-31;
var pnum=parseInt(document.getElementById('pn').value,10);
if (mh<=pnum/2*(-30)){
mh=0;
}
document.getElementById('listdiv').style.marginTop=mh+'px';
}
function doplay(){
if (scrollFlag){
scrollFlag=false;
clearTimeout(scrollFlag);
document.getElementById('playbut').value='开始抽奖';
var mh=parseInt(document.getElementById('listdiv').style.marginTop,10), pnum=parseInt(document.getElementById('pn').value,10), seln=parseInt(document.getElementById('spn').value,10);
var si=mh*(-1)/31;
var rewardarr = new Array();
for (var ri=0;ri
rewardarr.push(parseInt(document.getElementById('listdiv').childNodes[si+ri].innerHTML,10));
}
narrtmp = new Array();
for (var xi=0;xi
var ni=0, s=true;
for (var yi=0;yi
if (narr[xi]==rewardarr[yi]){s=false;break;}
}
if (s){
narrtmp.push(narr[xi]);
}
}
narr=new Array();
for (var xi=0;xi
narr.push(narrtmp[xi]);
}
drawlist();
var hs = '';
for (var i=0; i
hs+='
';
}
document.getElementById('rewardlist').innerHTML+=hs;
}else{
scrollFlag=true;
scrollitem();
document.getElementById('playbut').value='停止';
}
}
.item{width:400px;height:30px;line-height:30px;border-bottom:1px solid #000;text-align:center;font-weight:700;font-size:25px;}
.itemlist{width:430px;height:180px;border:1px solid #000;}
.itemcon{width:400px;}
.setdiv{width:803px;height:30px;line-height:30px;text-align:center;}
参加总人数
每次抽得个数
抽奖区 |
中奖号码 |
算法只是简单的洗牌,如有问题,欢迎大家指正。
html抽奖原理,抽奖器html相关推荐
- 【Android 插件化】插件化原理 ( 类加载器 )
Android 插件化系列文章目录 [Android 插件化]插件化简介 ( 组件化与插件化 ) [Android 插件化]插件化原理 ( JVM 内存数据 | 类加载流程 ) [Android 插件 ...
- Axure移动端app抽奖转盘+电商圆盘抽奖+商品抽奖+年会抽奖+抽奖动态+Axure通用抽奖转盘组件原型+九宫格方形随机抽奖原型组件+运营活动抽奖转盘
Axure移动端app抽奖转盘+电商圆盘抽奖+商品抽奖+年会抽奖+抽奖动态+Axure通用抽奖转盘组件原型+九宫格方形随机抽奖原型组件+运营活动抽奖转盘 原型演示及下载地址:https://www.p ...
- 【小程序与公众号】微信小程序九宫格抽奖(抽奖完全随机)
上图 话不多说直接上图,抽奖是顺时针又快变慢(还原抽奖的动画)进行抽奖,抽奖的几率都是随机 源码 接下来展示的就是微信小程序中的九宫格抽奖 说明 适用范围 抽奖逻辑只是原生JS,通过数据进行驱动,因此 ...
- html抽奖原理,js实现抽奖功能
在很多网站,app中我们都能看见抽奖功能,但是我们都能发现,很难抽中那些比较吸引人的东西,接下来我们来解开抽奖的面纱! 效果图 一,原理 通过,循环给最外层标签添加样式,让后通过匹配两个数组的值是否相 ...
- python转盘抽奖_react 抽奖转盘 ----小计
前言 很久没有写过小组件了,突然想做一个抽奖转盘,就花半天时间做一个,很简单 1.支持把一个圆盘分成n瓣. 2.实现转动动画. 3.弄个指针样式意思意思. 4.遇到抽奖的需求改吧改吧就能用了. 图是这 ...
- 不重复点名抽奖_抽奖新玩法?和平精英蜘蛛异变套装上线 参与十次可获得所有奖励...
自从国服刺激战场下架,我们迎来了全新的"吃鸡"游戏和平精英,虽说上架后玩家给予的评价并不是很好,但官方依然在持续更新.近期,和平精英新套装上线,除了与刺激战场国际服"蜘蛛 ...
- python自动抽奖_Python定时自动参与抽奖助手抽奖
打开localhost:8002的web管理端页面,此时应该已经可以看到数据请求了. 然后在手机上访问小程序,抽奖助手. 如果手机流量很杂影响筛选的话,可以在管理页面手动设置filter: 后续的步骤 ...
- python重复抽奖_python—抽奖程序
抽奖程序: 1.每次抽奖完成,会提示是否继续抽奖,只有输入"是"才继续抽奖 2.抽奖逻辑: (1)生产0-100的整数,构造成列表 (2)构造三个列表,分别是一等奖.二等奖.三等奖 ...
- PHP做大转盘抽奖的思路,jQuery实现幸运大转盘(php抽奖程序)抽奖程序
抽奖程序有各式各样的形式,其中幸运大转盘最为常见.线上线下都有很多的使用场景. 本文结合我自己的php网站,是实现一个php抽奖程序. 下图是该抽奖程序的截图: 一般的抽奖程序主要是算法程序,界面效果 ...
最新文章
- Ansible04-任务控制
- WebApi与Mvc的区别
- 何时在C ++中使用extern
- segformer 使用笔记
- java之java.sql.SQLException: ResultSet is from UPDATE. No Data.
- Eclipse 报 “Exception in thread main java.lang.OutOfMemoryError: Java heap space ”错误的解决办法
- 手持gps坐标转换参数求解方法及在excel中的实现_分享∣Arcgis中62个常用技巧系列二(21-40技巧)...
- Sqlserver2014下载与安装
- EF for Firebird
- iphone开热点电脑总是搜不到问题的解决办法(百试百灵)
- 华为5G折叠屏手机Mate X 重新入网,即将上市!
- DiQuick Web UI 框架 V1.3.2 版本更新
- OceanBase云平台简介
- 为什么很多公司不允许使用C++ STL?
- 你要的Chrome插件都在这里了
- 获取emf图片格式的方法
- SpringBoot+FreeMarker+flying-saucer-pdf实现PDF预览、分页需求
- 人脉就是钱脉,培养人脉的106个技巧
- 计算机用户与权限如何设置密码,如何设置电脑用户权限_如何设置电脑使用时间...
- 项目管理——项目进度的确定