简介:jQuery自定义数值抽奖活动代码是一款点击开始按钮计算机会产生玩家输入范围内的随机数,点击停止按钮,将显示数字最终结果的效果。

效果图如下:

代码如下:

jQuery自定义数值抽奖活动代码 - 脚本之家

#bigDiv {

width: 1080px;

margin: 0px auto; /*div网页居中*/

background-color: #494949;

color: #FFFFFF;

}

h1 {

text-align: center; /*文本居中*/

padding-top: 10px;

}

#first, #second, #third {

width: 360px;

height: 360px;

font-size: 150px;

line-height: 360px;

text-align: center;

float: left; /*让三个盒子左浮动*/

}

#first {

background-color: #009BFF;

opacity: 0.9;

}

#second {

background-color: #007CCC;

}

#third {

background-color: #005388;

}

input {

font-size: 30px;

font-weight: 900;

}

#start {

margin-left: 40%;

margin-right: 5%;

}a{color:blue;}

玩家幸运抽奖活动

适用浏览器:IE8、360、FireFox、Chrome、Safari、Opera、傲游、搜狗、世界之窗.

来源: 脚本之家

特效库

代码说明

js文件代码如下:

var ran = 0;

var range = 0;

var myNumber;

/*将产生随机数的方法进行封装*/

function sjs(range) {

ran = Math.random() * range;//[0,range)的随机数

var result = parseInt(ran);//将数字转换成整数

return result;

}

/*对显示随机数的方法进行封装*/

function showRandomNum() {

var figure = sjs(range);

$("#first").html(figure);

var figure2 = sjs(range);

$("#second").html(figure2);

var figure3 = sjs(range);

$("#third").html(figure3);

}

$(function () {

/*点击开始按钮,产生的事件*/

$("#start").click(function () {

range = prompt("请输入随机数范围:", "168");

if (range == null)//http://yulu.jb51.net/h/bjaf/3siyd3x7.htm

{

return;

}

if (range == 0)

{

return;

}

if (isNaN(range))//http://yulu.jb51.net/h/bjaf/9vhm2l4f.htm

{

alert("请输入数字");

return ;

}

/*将开始标签禁用,停止标签启用*/

$("#start")[0].disabled = true;

$("#stop")[0].disabled = false;

if (range > 9999 || range

{

// by 何问起

$("#bigDiv div").css("font-size", "60px");//http://yulu.jb51.net/h/bjaf/omgdn4mu.htm

//return;

}

myNumber = setInterval(showRandomNum, 50);//多长时间运行一次,单位毫秒

});

/*点击结束按钮*/

$("#stop").click(function () {

/*将开始标签启用,停止标签禁用*/

$("#start")[0].disabled = false;

$("#stop")[0].disabled = true;

clearInterval(myNumber);

});

});

以上这篇jquery输入数字随机抽奖特效的简单实现代码就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持脚本之家。

java单数字随机抽奖特效_jquery输入数字随机抽奖特效的简单实现代码相关推荐

  1. JavaScript实现输入数字,输出是几月份的代码

    以下为实现输入数字,输出是几月份的代码和运行截图 目录 前言 一.实现输入数字,输出是几月份的 1.1 运行流程及思想 1.2 代码段 1.3 JavaScript语句代码 1.4 运行截图 前言 1 ...

  2. java单数字随机抽奖特效_js实现简易的单数字随机抽奖(0-9)

    本文分享的网页特效是一个可以控制开始停止的数字抽奖游戏,类似很多电视上那种数字抽奖游戏,下面就是我分享的全部代码: 简易的单数字随机抽奖,抽取随机数的js特效代码 var num = document ...

  3. java输入数字_在java中,如何从键盘中输入数字,字符,字符串

    java不像C中拥有scanf这样功能强大的函数,大多是通过定义输入输出流对象. 常用的类有BufferedReader,Scanner. 实例程序: 一,利用 Scanner 实现从键盘读入inte ...

  4. python列表输入数字逗号隔开_第一行Python代码之我的第一个Project(3)

    EMS项目之dict字典结构 文章目录 dict字典介绍 字典输出 更新字典值 删除字典和字典元素 tuple数据类型 数据结构总结 dict字典介绍 字典是另一种可变容器模型,且可存储任意类型对象. ...

  5. c++ 输入数字 输出汉语读法(拼音)代码

    这里只写到了十亿的等级,如果要更大位数可以继续扩展 #include<iostream> #include<cstring> using namespace std; int ...

  6. 用 JavaScript 验证只能输入数字,并做数字加总

    开发系统时,常会需要将使用者在多个 TextBox 中输入的数字,做加总的计算,此时必须验证使用者只能输入数字.如下图 1 所示,有时可能还需要用 JavaScript 做数字的实时加总计算,并将计算 ...

  7. 计算机符号大写怎么退出,如何输入数字,字母 和 回车换行符,大写字母锁定输入模式怎么退出...

    如何输入数字,字母 和 回车换行符,大写字母锁定输入模式怎么退出 1234笔画输入法 - 使用帮助 如何输入数字,字母: 如果你开启了大键盘输入,可以按Shift键,切换中英文输入模式:就可以输入:数 ...

  8. IDC_EDIT控件输入数字改变IDC_SCROLLBAR滑块位置

    IDC_EDIT控件输入数字改变IDC_SCROLLBAR滑块位置 之前的代码能够将滑块的位置信息转换成数字显示在编辑框,但是编辑框的数字信息无法在滑块的位置来体现出来,也就是说,我编辑框中输入数字, ...

  9. 输入框内只能输入数字,输入其他内容不显示

    JavaScript中Event.returnValue属性 : 该属性是设置或者获取事件的返回值,Event对象的returnValue属性的值一般是true,即脚本处理完自己的工作后由元素处理事件 ...

最新文章

  1. 数据分析与挖掘理论-数据探索
  2. 【计算机组成原理】多功能算数逻辑运算单元
  3. 深入理解HashMap(原理,查找,扩容)
  4. 快速通读《现代软件工程——构建之法》
  5. dubbo 自定义线程池
  6. HDU - 4746预处理莫比乌斯反演
  7. Android 系统性能优化(58)---开机时间优化
  8. swarm部署mysql_「实战篇」开源项目docker化运维部署-借助dockerSwarm搭建集群部署(九)...
  9. 斯坦福大学深度学习公开课cs231n学习笔记(2)线性分类器及最优化
  10. POI填充Excel背景色
  11. android第三方库适配鸿蒙,鸿蒙第三方适配rom
  12. boost::heap::binomial_heap用法的测试程序
  13. OpenSSL安全特征问题漏洞(CVE-2022-2068)版本1.0.2k-fips升级到3.0.5
  14. 路普达-区块链技术的本质与未来应用趋势
  15. 直播间小游戏,带货直播源码如何实现?
  16. iOS清除WKWebView缓存
  17. 由酷6员工猝死想到的:IT民工 我该拿什么拯救你
  18. java 加密方式_Get史上最优雅的加密方式!没有之一!
  19. 腹肌练习能帮助燃烧腹部脂肪吗?看完再也没有疑惑了
  20. ERP标准成本计算需要哪些数据准备

热门文章

  1. 如何使用电视遥控器在Windows中控制Netflix
  2. 2022第五空间网络安全大赛
  3. PerformanceTest, monitoring command
  4. 阿里云万网虚拟主机安装配置Https(SSL)教程
  5. 小米生态链之殇?“去小米化”的企业终将会积极拥抱小米
  6. OSI七层模型的每一层协议
  7. 海思系列平台编译器安装及配置
  8. 【附源码】计算机毕业设计JAVA评标专家管理信息系统
  9. 用命令行重启/关闭电脑
  10. 【GaussDB数据库----连接】