HTML +　ＪＳ随机抽号。

【设置第三次抽取的号码为 （张三6）】
<script language="javascript">

         var k =  0 ;

         function star(){

             k++ ;

             loop()

         }

         var t ;

         var i ;

         var bs =true ;

         function loop(){

             t = setTimeout( loop , 25 ) //时钟控件

             var r = Math.random()*40

             i = parseInt( r )

             if( bs ){

             $( $(".m")[i] ).css( "background-color" , "#ccff00" )

         bs = false ;

         }else {

             $( $(".m") ).css( "background-color" , "#6666CC" )

         bs = true ;

         }

     }

     function stop(){

          clearTimeout( t )

          if( k==3 ){

          $( $(".m") ).css( "background-color" , "#6666CC" )

          $( $(".m")[5] ).css( "background-color" , "#ccff00" )

       }else{

         $( $(".m")[i] ).css( "background-color" , "#ccff00" )

    }

     }

 </script>

<!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>随机抽号程序</title>

<style type="text/css">

<!--

body {

    background-attachment: scroll;

    background-image: url(images/sjxh.jpg);

    background-repeat: no-repeat;

    background-position: right center;

    background-color: #333333;

}

#title {

    height: 25px;

    width: 300px;

    margin-right: auto;

    margin-left: auto;

    font-size: 25px;

    font-weight: bolder;

    color: #FFFFFF;

    line-height: 25px;

    margin-bottom: 50px;

    margin-top: 20px;

}

#box {

    height: 356px;

    width: 890px;

    margin-right: auto;

    margin-left: auto;

}

#rmd {

    width: 300px;

    float: none;

    clear: left;

}

#stop {

    height: 50px;

    width: 120px;

    float: left;

    font-size: 25px;

    font-weight: bold;

    color: #FFFFFF;

    text-align: center;

    vertical-align: middle;

    line-height: 50px;

}

#star {

    font-size: 25px;

    line-height: 50px;

    font-weight: bold;

    color: #FFFFFF;

    height: 50px;

    width: 120px;

    margin-right: auto;

    margin-left: 35%;

    text-align: center;

    vertical-align: middle;

    float: left;

}

#star a {

    color: #FFFFFF;

    text-decoration: none;

    height: 50px;

    width: 120px;

    background-color: #33FF00;

    display: block;

}

#stop a {

    color: #FFFFFF;

    text-decoration: none;

    background-color: #FF0000;

    display: block;

    height: 50px;

    width: 120px;

}

.m {

    font-size: 22px;

    line-height: 60px;

    font-weight: bold;

    color: #FFFFFF;

    background-color: #6666CC;

    text-align: center;

    vertical-align: middle;

    float: left;

    height: 60px;

    width: 100px;

    margin: 5px;

    font-family: "微软雅黑";

}

body,td,th {

    font-family: 微软雅黑 Light;

    font-size: 20px;

    color: #FFFFFF;

    font-weight: bold;

}

-->

</style>

</head>

<script language="javascript" src="js/jquery-1.10.2.min.js"></script>

<script language="javascript">

        function star(){

            loop()

        }

          var t ;

          var i ;

          var bs =true ;

        function loop(){

             t = setTimeout( loop , 25 ) //时钟控件

             var r = Math.random()*40

             i = parseInt( r )

            if( bs ){

            $( $(".m")[i] ).css( "background-color" , "#ccff00" )

        bs = false ;

       }else {

            $( $(".m") ).css( "background-color" , "#6666CC" )

         bs = true ;

        }

     }

     function stop(){

         clearTimeout( t )

          $( $(".m")[i] ).css( "background-color" , "#ccff00" )

           var rm = document.createElement('div');

           rm.innerHTML = $( $(".m")[i] ).html();

           document.body.appendChild(rm);

     }

 </script>

<body>

<div id="title">网站随机抽号程序</div>

<div id="box">

  <div class="m">张三1</div>

  <div class="m">张三2</div>

  <div class="m">张三3</div>

  <div class="m">张三4</div>

  <div class="m">张三5</div>

  <div class="m">张三6</div>

  <div class="m">张三7</div>

  <div class="m">张三8</div>

  <div class="m">张三9</div>

  <div class="m">张三10</div>

  <div class="m">张三11</div>

  <div class="m">张三12</div>

  <div class="m">张三13</div>

  <div class="m">张三14</div>

  <div class="m">张三15</div>

  <div class="m">张三16</div>

  <div class="m">张三17</div>

  <div class="m">张三18</div>

  <div class="m">张三19</div>

  <div class="m">张三20</div>

  <div class="m">张三21</div>

  <div class="m">张三22</div>

  <div class="m">张三23</div>

  <div class="m">张三24</div>

  <div class="m">张三25</div>

  <div class="m">张三26</div>

  <div class="m">张三27</div>

  <div class="m">张三28</div>

  <div class="m">张三29</div>

  <div class="m">张三30</div>

  <div class="m">张三31</div>

  <div class="m">张三32</div>

  <div class="m">张三33</div>

  <div class="m">张三34</div>

  <div class="m">张三35</div>

  <div class="m">张三36</div>

  <div class="m">张三37</div>

  <div class="m">张三38</div>

  <div class="m">张三39</div>

  <div class="m">张三40</div>

</div>

<div id="star"><a href="#" onclick="star()">开始</a></div>

<div id="stop"><a href="#" onclick="stop()">停止</a></div>

<div id="rmd"></div>

</body>

</html>

HTML +　ＪＳ随机抽号。的更多相关文章

js 随机生成姓名、手机号、身份证号、银行卡号
开发测试的时候,经常需要填写姓名.手机号.身份证号.银行卡号,既要符合格式要求.又不能重复.大家会到网上搜各种生成器.能不能自己写一个简单的生成器呢.下面是随机生成姓名.手机号.身份证号.银行卡号的j ...
ppt VBA 实现随机抽题
目录目标/最终效果关于VBA VBA简单示例检查环境步骤 VBA实现随机抽题 todo challenge 目标/最终效果目标是制作一个ppt,实现随机抽题,具体描述: 第一页幻灯片中:点击 ...
Java用n种方法编写实现双色球随机摇号案例
方法清单规则实现方式一实现方式二实现方式三实现方式四实现方法五之前我用JavaScript编写过一个实现双色球随机摇号的案例, 点击此处查看,今天我再用Java语言来实现这一效果. 规则 ...
js 随机星星 document.createElement(); setAttribute()
js 随机星星 document.createElement(); setAttribute() <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1. ...
js随机更换
如果想实现“随机”切换图像,那么我们要使用到几个Math()对象第一个是random()函数,函数的功能是产生随机数,如果书写为 var a=Math.random() 那么所产生的随机数是0-1( ...
js验证身份证号，超准确
js验证身份证号,超准确看程序前先来了解下身份证号的构成:身份证号分为两种,旧的为15位,新的为18位.身份证15位编码规则:dddddd yymmdd xx p 其中 dddddd:地区码 ...
JS随机生成不重复数据的代码分享
JS随机生成不重复数据. 代码如下: <script> // 定义存放生成随机数的数组 var array=new Array(); // 循环N次生成随机数 for(var i = 0 ...
highlight.js 设置行号
原文地址:highlight.js 设置行号博客地址:http://www.extlight.com 一.背景笔者在开发这套博客系统时使用 Editormd 作为 Markdown 编辑器,由于不 ...
实现纸牌游戏的随机抽牌洗牌过程（item系列几个内置方法的实例）
实现纸牌游戏的随机抽牌洗牌过程(item系列几个内置方法的实例) 1.namedtuple:命名元组,可以创建一个没有方法只有属性的类 from collections import namedtup ...

随机推荐

更快学习 JavaScript 的 6 个思维技巧
更快学习 JavaScript 的 6 个思维技巧我们在学习JavaScript,或其他任何编码技能的时候,往往是因为这些拦路虎而裹足不前: 有些概念可能会造成混淆,尤其当你是从其他语言转过来的时候 ...
UIWebView、WKWebView使用详解及性能分析
http://www.cnblogs.com/junhuawang/p/5759224.html
冒泡排序和用for循环画菱形
忘了当时刚开始学java编程时提到的冒泡排序和for循环画菱形怎么做了, 找了找以前的练习, 重新修改了一遍, 其实冒泡排序也是可以排列字符串和字符的, package com.test; publi ...
NetCDF 入门
一.概述 NetCDF全称为network Common Data Format,中文译法为“网络通用数据格式”,对程序员来说,它和zip.jpeg.bmp文件格式类似,都是一种文件格式的标准.ne ...
对OnOutOfMemoryError的运维处理
以部署在linux系统/opt/Server目录下的Server.jar为例 1.在run.sh启动脚本中添加jvm参数: -XX:OnOutOfMemoryError=/opt/Server/res ...
iscsi: 多路径
作者:吴香伟发表于 2014/10/8 版权声明:可以任意转载,转载时务必以超链接形式标明文章原始出处和作者信息以及版权声明上图(a)给出了计算机的总线结构,SCSI磁盘挂在SCSI卡上,SCSI ...
02-Swift初体验
Playground是什么? 从Xcode6开始出现(Swift开始出现) 翻译为:操场/游乐场对于学习Swift基本语法非常方便所见即所得(快速查看结果) 语法特性发生改变时,可以快速查看. S ...
SAP第一轮面试总结
1. 开始是一套面试题,可以选JAVA或C/C++两个语言的英文题.基础语法题,以指针为主. 2. 英文介绍,自由发挥.问了以下几个问题: 离职的愿意,未来五年的计划,介不介意使用ABAP langu ...
SGA(System Global Area)
系统激活时在内存内规划的一个固定的区域,用于存储每位使用者所需存取的数据和必备的系统信息.这个区域成为系统全局区. 数据块缓存区:存放读取数据文件的数据块副本,或者曾经处理过的数据.有效减少读取数据时 ...
windows配置thrift开发环境
1)安装thrift:到thrift官网下载exe文件,然后将文件重命名为thrift.exe,拷贝到c:\windows目录下(或者任何目录下),然后就可以在dos环境下使用了 c:\windows ...

HTML + ＪＳ随机抽号。

HTML + ＪＳ随机抽号。的更多相关文章

随机推荐

热门专题

HTML +　ＪＳ随机抽号。

HTML +　ＪＳ随机抽号。的更多相关文章