精华内容
下载资源
问答
  • 抽奖页面制作
    千次阅读
    2020-05-07 00:10:12

    html

    <html>
    <head>
    <meta charset="utf-8">
    <title>抽奖web</title>
      <meta charset="utf-8">
      <meta name="viewport" content="width=device-width, initial-scale=1">
      <link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/4.3.1/css/bootstrap.min.css">
      <script src="https://cdn.staticfile.org/jquery/3.2.1/jquery.min.js"></script>
      <script src="https://cdn.staticfile.org/popper.js/1.15.0/umd/popper.min.js"></script>
      <script src="https://cdn.staticfile.org/twitter-bootstrap/4.3.1/js/bootstrap.min.js"></script>
    </head>
    <body background="https://ss0.bdstatic.com/94oJfD_bAAcT8t7mm9GUKT-xh_/timg?image&quality=100&size=b4000_4000&sec=1588772845&di=207b5ab133cb84f363ba5e96e38e9e89&src=http://pic.90sjimg.com/back_pic/qk/back_origin_pic/00/02/19/1f671b65310564cdc8f42b67f9c8b0b9.jpg">
        <center><h1>抽奖程序</h1></center><br>
        <div class="container-fluid">
        <div class="row">
            <div class="col-sm-8">
            	<div>
                    <div class="form-group">
                        <label for="comment">参与抽奖人员【例如张三18888888888-李四18888888888-……】</label>
                            <textarea class="form-control" rows="5" id="User"></textarea>
                    </div>
                    <div>
                        抽出几个:<input type="number" name="successUserNumber" id="randomNumber">
                        <button id="start" onclick="startRun()">开始抽奖</button>
                        <button onclick="stop()">停止</button>
                        <button onclick="location.reload()">重新抽奖</button>
                    </div>
            	</div>
                <center>
                        <h1 id="randomUser"></h1>
                        <h1 id="successUser"></h1>
                </center>
            </div>
                <div class="col-sm-4">
                    <div class="parent">
                        <div class="child">
                        <table class="table">
                            <thead>
                                <tr>
                                <th>参与抽奖人员</th>
                                </tr>
                            </thead>
                        <tbody id="tableuser">
                        </tbody>
                        </table>
                        </div>
                    </div>
                </div>
        </div>
    </div>
    </body>
    </html>
    

    js and css:

    <style type="text/css">
    .parent{
        position:relative;
        height:150%;//高度根据需求自行设定
    }
    .child{
        position:absolute;
        left:0;
        top:0;
        right:0;
        bottom:0;  //left,top,right,bottom都为0,充满真个页面
        overflow-y:auto;
        overflow-x:hidden; //设置Y轴出现滚动条,X轴隐藏
    }
    </style>
    <script type="text/javascript">
    var userArray=new Array();//定义用户数组
    var timer;
    var outUser;
    var randomNumber;
    var user;
    function startRun() {
        $('#successUser').html('');
    	var inUser=document.getElementById('User').value.split('-')
        randomNumber=document.getElementById('randomNumber').value
        $('#start').attr({"disabled":"disabled"});//保证一次点击一次抽奖防止死循环
    	for (i=0;i<inUser.length;i++) {
            userArray[i]=inUser[i]
    		user+='<tr><td>'+inUser[i]+'</td></tr>'
        }
            $('#tableuser').html(user);
            outUser=shuffle(userArray);
            timer=setInterval("randomShow()",10);
    }
    function shuffle(arr) {
        //著名的洗牌算法,原理就是遍历数组元素,将当前元素与随机抽取的一个剩余元素进行交换。
        for (let i=arr.length-1; i>=0; i--) {
            let rIndex = Math.floor(Math.random()*(i+1));
            // 打印交换值
            // console.log(i, rIndex);
            let temp = arr[rIndex];
            arr[rIndex] = arr[i];
            arr[i] = temp;
        }
        return arr;
    }
    function randomShow(){
        pcount = userArray.length - 1;
    	num = Math.floor(Math.random() * pcount);
        html=userArray[num]
        $('#randomUser').html(html)
    }
    function stop(){
        let html=''
        clearInterval(timer);
        //$('#start').removeAttr('disabled');
        $('#randomUser').html('');
        for(i=0;i<randomNumber;i++){
            var number=i+1
            html+='<br><span class="badge badge-success">第'+number+'名-----'+outUser[i]+'</span><br>'
        }
    
        $('#successUser').html(html);
    }
    </script>
    

    在这里插入图片描述
    学习阶段,代码可能有些冗余。

    更多相关内容
  • 基于jQuery制作红色喜庆古典中国风格的抽奖页面模板,点击开始抽奖号码数字滚动后台,点可抽奖按钮,获得中奖结果。
  • 网页版电话号码抽奖

    2016-02-16 09:49:55
    1.程序完全是js实现 2.内容可以是手机号或者姓名等文字 3.奖项可以分批抽取4.专门设置了无效按钮 5.适合用作院庆、年会抽奖活动
  • 在微信小程序中做一个好看的抽奖界面 先上图片吧: 基本上格式就是八个抽奖按钮,中间一个开始按钮,后面在加一张好看的背景图就完事啦 接下来就是代码啦: js中: var app = getApp() Page({ data: { circleList...

    在微信小程序中做一个好看的抽奖界面
    先上图片吧:

    基本上格式就是八个抽奖按钮,中间一个开始按钮,后面在加一张好看的背景图就完事啦
    接下来就是代码啦:
    js中:

    var app = getApp()
    Page({
     data: {
      circleList: [],//圆点数组
      awardList: [],//奖品数组
      colorCircleFirst: '#FFDF2F',//圆点颜色1
      colorCircleSecond: '#FE4D32',//圆点颜色2
      colorAwardDefault: '#F5F0FC',//奖品默认颜色
      colorAwardSelect: '#ffe400',//奖品选中颜色
      indexSelect: 0,//被选中的奖品index
      isRunning: false,//是否正在抽奖
      imageAward: [
        'https://img.coolcr.cn/2020/12/23/6d40279b20a0f.png',
        'https://img.coolcr.cn/2020/12/23/0762b5d6f587f.png',
        'https://img.coolcr.cn/2020/12/23/03d0ebc7df721.png',
        'https://img.coolcr.cn/2020/12/23/20f3ae1193353.png',
        'https://img.coolcr.cn/2020/12/23/33e147878b73a.png',
        'https://img.coolcr.cn/2020/12/23/6137e50196a4e.png',
        'https://img.coolcr.cn/2020/12/23/a7e51c830d55b.png',
        'https://img.coolcr.cn/2020/12/23/c338bc5163113.png',
      ],//奖品图片数组
     },
    
     onLoad: function () {
      var _this = this;
      //圆点设置
      var leftCircle = 7.5;
      var topCircle = 7.5;
      var circleList = [];
      for (var i = 0; i < 24; i++) {
       if (i == 0) {
        topCircle = 15;
        leftCircle = 15;
       } else if (i < 6) {
        topCircle = 7.5;
        leftCircle = leftCircle + 102.5;
       } else if (i == 6) {
        topCircle = 15
        leftCircle = 620;
       } else if (i < 12) {
        topCircle = topCircle + 94;
        leftCircle = 620;
       } else if (i == 12) {
        topCircle = 565;
        leftCircle = 620;
       } else if (i < 18) {
        topCircle = 570;
        leftCircle = leftCircle - 102.5;
       } else if (i == 18) {
        topCircle = 565;
        leftCircle = 15;
       } else if (i < 24) {
        topCircle = topCircle - 94;
        leftCircle = 7.5;
       } else {
        return
       }
       circleList.push({ topCircle: topCircle, leftCircle: leftCircle });
      }
      this.setData({
       circleList: circleList
      })
      //圆点闪烁
      setInterval(function () {
       if (_this.data.colorCircleFirst == '#FFDF2F') {
        _this.setData({
         colorCircleFirst: '#FE4D32',
         colorCircleSecond: '#FFDF2F',
        })
       } else {
        _this.setData({
         colorCircleFirst: '#FFDF2F',
         colorCircleSecond: '#FE4D32',
        })
       }
      }, 500)
      //奖品item设置
      var awardList = [];
      //间距,怎么顺眼怎么设置吧.
      var topAward = 25;
      var leftAward = 25;
      for (var j = 0; j < 8; j++) {
       if (j == 0) {
        topAward = 25;
        leftAward = 25;
       } else if (j < 3) {
        topAward = topAward;
        //166.6666是宽.15是间距.下同
        leftAward = leftAward + 166.6666 + 15;
       } else if (j < 5) {
        leftAward = leftAward;
        //150是高,15是间距,下同
        topAward = topAward + 150 + 15;
       } else if (j < 7) {
        leftAward = leftAward - 166.6666 - 15;
        topAward = topAward;
       } else if (j < 8) {
        leftAward = leftAward;
        topAward = topAward - 150 - 15;
       }
       var imageAward = this.data.imageAward[j];
       awardList.push({ topAward: topAward, leftAward: leftAward, imageAward: imageAward });
      }
      this.setData({
       awardList: awardList
      })
     },
     //开始游戏
     startGame: function () {
      if (this.data.isRunning) return
      this.setData({
       isRunning: true
      })
      var _this = this;
      var indexSelect = 0
      var i = 0;
      var timer = setInterval(function () {
       indexSelect++;
       //这里我只是简单粗暴用y=30*x+200函数做的处理.可根据自己的需求改变转盘速度
       i += 30;
       if (i > 1000) {
        //去除循环
        clearInterval(timer)
        //获奖提示
    
    
        wx.showModal({
         title: '恭喜您',
         content: '获得了第' + (_this.data.indexSelect + 1) + "个优惠券",
         showCancel: false,//去掉取消按钮
         success: function (res) {
          if (res.confirm) {
           _this.setData({
            isRunning: false
           })
          }
         }
        })
       }
       indexSelect = indexSelect % 8;
       _this.setData({
        indexSelect: indexSelect
       })
      }, (200 + i))
     }
    })
    
    

    wxml中:

    <view class="container-out">
    <image class='background' src="https://img.coolcr.cn/2020/12/24/8b823815b413e.jpg" mode="aspectFill"></image>
    
     <view class="circle" wx:for="{{circleList}}" style="top:{{item.topCircle}}rpx;left:{{item.leftCircle}}rpx;background-color: {{(index%2==0)?colorCircleFirst:colorCircleSecond}};"></view>
     <view class="container-in">
      <view class="content-out" wx:for="{{awardList}}" style="top:{{item.topAward}}rpx;left:{{item.leftAward}}rpx;background-color: {{(index==indexSelect)?colorAwardSelect:colorAwardDefault}};">
       <image class="award-image" src="{{item.imageAward}}" ></image>
      </view>
      <view class="start-btn" bindtap="startGame" style=" background-color:{{isRunning?'#e7930a':'#ffe400'}}">START</view>
     </view>
    </view>
    

    wxss中:

    /**index.wxss**/
    
    .container-out {
      height: 600rpx;
      width: 650rpx;
      background-color: #b136b9;
      margin: 100rpx auto;
      border-radius: 40rpx;
      box-shadow: 0 10px 0 #871a8e;
      position: relative;
     }
     
     .container-in {
      width: 580rpx;
      height: 530rpx;
      background-color: #871a8e;
      border-radius: 40rpx;
      position: absolute;
      left: 0;
      right: 0;
      top: 0;
      bottom: 0;
      margin: auto;
     }
     
     /**小圆球
     box-shadow: inset 3px 3px 3px #fff2af;*/
     
     .circle {
      position: absolute;
      display: block;
      border-radius: 50%;
      height: 20rpx;
      width: 20rpx;
     }
     
     .content-out {
      position: absolute;
      height: 150rpx;
      width: 166.6666rpx;
      background-color: #f5f0fc;
      border-radius: 15rpx;
      box-shadow: 0 5px 0 #d87fde;
     }
     
     /**居中 加粗*/
     
     .start-btn {
      position: absolute;
      margin: auto;
      top: 0;
      left: 0;
      bottom: 0;
      right: 0;
      border-radius: 15rpx;
      height: 150rpx;
      width: 166.6666rpx;
      background-color: #ffe400;
      box-shadow: 0 5px 0 #e7930a;
      color: #f6251e;
      text-align: center;
      font-size: 55rpx;
      font-weight: bolder;
      line-height: 150rpx;
     }
     
     .award-image {
      position: absolute;
      margin: auto;
      top: 0;
      left: 0;
      bottom: 0;
      right: 0;
      height: 140rpx;
      width: 130rpx;
      z-index: 1;
     }
    
     .container{
      width: 100%;
      height: 600rpx;
      margin: 0;
      padding: 0;
      position: relative;
    }
    image{
      width: 100%;
      height: 100%;
      position:fixed; 
      background-size:100% 100%;
      z-index: -1;
      top:0;
      left: 0;
    }
    .up{
      position: absolute;
      z-index: 1;
    }
    .background {
      width: 100%;
      height: 100%;
      position:fixed; 
      background-size:100% 100%;
      z-index: -1;}
    

    就酱紫,一个抽奖的界面就做好了!

    展开全文
  • 基于jQuery制作红色喜庆古典中国风格的抽奖页面模板,点击开始抽奖号码数字滚动后台,点可抽奖按钮,获得中奖结果过程。
  • jquery.mobile.js制作活动页面数字随机抽奖代码 jquery.mobile.js制作活动页面数字随机抽奖代码
  • HTML手机签到转盘抽奖页面模板基于Bootstrap3.3.2制作,响应式设计,包括签到、日历、转盘抽奖、中奖纪录等手机模板页面。
  • HTML5+CSS大作业——年会抽奖网页设计(1页) 常见网页设计作业题材有 个人、 美食、 公司、 学校、 旅游、 电商、 宠物、 电器、 茶叶、 家居、 酒店、 舞蹈、 动漫、 明星、 服装、 体育、 化妆品、 物流、 环保、 ...

    HTML5+CSS大作业——年会抽奖网页设计(1页)

    常见网页设计作业题材有 个人、 美食、 公司、 学校、 旅游、 电商、 宠物、 电器、 茶叶、 家居、 酒店、 舞蹈、 动漫、 明星、 服装、 体育、 化妆品、 物流、 环保、 书籍、 婚纱、 军事、 游戏、 节日、 戒烟、 电影、 摄影、 文化、 家乡、 鲜花、 礼品、 汽车、 其他 等网页设计题目, A+水平作业, 可满足大学生网页大作业网页设计需求, 喜欢的可以下载!

    一、作品展示

    在这里插入图片描述

    二、文件目录

    在这里插入图片描述

    三、代码实现

    
    <!DOCTYPE html>
    <html>
    <head>
    	<meta charset="utf-8">
    	<title>三等奖</title>
    
    	<link rel="stylesheet" type="text/css" href="css/common.css">
    	<link rel="stylesheet" type="text/css" href="css/page3.css">
    </head>
    <body>
    	<audio src="img/common/lucky.mp3" preload id="bg-music"></audio>
    
    	<div class="contianer">
    
    		<div class="center">
    			<img src="picture/center.png">
    		</div>
    
    		<div class="top">
    			<img src="picture/top.png">
    		</div>
    
    		<div class="back">
    			<a href="index.html"></a>
    		</div>
    
    		<div class="tip">
    			总数15人,每次抽取5名,总共3次
    		</div>
    
    		<div class="btm">
    			<img src="picture/btm.png">
    		</div>
    
    		<div class="start">
    			<a class="startBtn" href="javascript:void(0);"></a>
    		</div>
    
    		<div class="circle-bg">
    			<div class="circle1">
    				<img src="picture/circle1.png">
    			</div>
    			<div class="circle2">
    				<img src="picture/circle2.png">
    			</div>
    			<div class="circle3">
    				<img src="picture/circle3.png">
    			</div>
    		</div>
    
    		<div class="group1">
    			<div class="group1Bg">
    				<img src="picture/group1.png">
    			</div>
    			<div class="group1Txt">
    				用户a<br>
    				用户b<br>
    				用户c<br>
    				用户d<br>
    				用户e
    			</div>
    		</div>
    
    		<div class="group2">
    			<div class="group2Bg">
    				<img src="picture/group2.png">
    			</div>
    			<div class="group2Txt">
    				用户a<br>
    				用户b<br>
    				用户c<br>
    				用户d<br>
    				用户e
    			</div>
    		</div>
    
    		<div class="group3">
    			<div class="group3Bg">
    				<img src="picture/group3.png">
    			</div>
    			<div class="group3Txt">
    				用户a<br>
    				用户b<br>
    				用户c<br>
    				用户d<br>
    				用户e
    			</div>
    		</div>
    
    	</div>
    
    	<script type="text/javascript" src="js/jquery-3.2.1.min.js"></script>
    	<script>
    		$(function(){
    			$('.startBtn').click(function(){
    
    				$('.circle-bg').addClass('fadeInUp');
    				$('.circle1').addClass('rotateIn1');
    				$('.circle2').addClass('rotateIn2');
    				$('.group1').addClass('groupshow');
    				$('.startBtn').removeClass('startBtn').addClass('startBtn2');
    
    				// 背景音乐
    				function audioAutoPlay() {        
    					var audio = document.getElementById('bg-music');            
    					audio.play();
    					setTimeout(function(){
    						audio.pause();
    						$('.circle1').removeClass('rotateIn1');
    						$('.circle2').removeClass('rotateIn2');
    					},12000);
    				}
    				audioAutoPlay();
    
    				$('.startBtn2').click(function(){
    					$('.startBtn2').removeClass('startBtn2').addClass('startBtn3');
    					$('.group2').addClass('groupshow');
    
    					$('.startBtn3').click(function(){
    						$('.startBtn3').removeClass('startBtn3').addClass('startBtn4');
    						$('.group3').addClass('groupshow');
    
    						$('.startBtn4').click(function(){
    							alert('三等奖已抽奖完毕!');
    						});
    						
    					});
    				});
    
    			});
    
    		})
    	</script>
    </body>
    </html>
    
    

    四、获取更多源码

    ~ 关注我,点赞博文~ 每天带你涨知识!
    相关问题可以相互学习,可关注↓公Z号 获取更多源码 !
    在这里插入图片描述

    五、学习资料

    web前端 零基础-入门到高级 (视频+源码+开发软件+学习资料+面试题) 一整套 (教程)
    适合入门到高级的童鞋们入手~送1000套HTML+CSS+JavaScript模板网站
    在这里插入图片描述


    六、更多源码

    PC电脑端关注我们

    HTML5期末考核大作业源码* 包含 个人、 美食、 公司、 学校、 旅游、 电商、 宠物、 电器、 茶叶、 家居、 酒店、 舞蹈、 动漫、 明星、 服装、 体育、 化妆品、 物流、 环保、 书籍、 婚纱、 军事、 游戏、 节日、 戒烟、 电影、 摄影、 文化、 家乡、 鲜花、 礼品、 汽车、 其他 可满足大学生网页大作业网页设计需求, 喜欢的可以下载!
    在这里插入图片描述

    展开全文
  • 我们在上网做问卷调查或投票结束后,时常都会遇到抽奖,不过基本都是假的哈。...GitHub - tanzhuokun/GetAward.github.io: 抽奖JS简单实现样式结果:image.png点击“开始抽奖”就进行背景色滚动,当然也可以写...

    我们在上网做问卷调查或投票结束后,时常都会遇到抽奖,不过基本都是假的哈。下面将由简单的js代码来实现一下。

    首先思路:1.写出需要的HTML和CSS样式 2.js实现滚动,停止,弹出奖品框。文中所示的代码已上传至GitHub啦。GitHub - tanzhuokun/GetAward.github.io: 抽奖JS简单实现

    样式结果:

    e2798342104e

    image.png

    点击“开始抽奖”就进行背景色滚动,当然也可以写成另一种样式,抽奖按钮在中间,8个奖品即可,用CSS改变下样式就OK啦。

    CSS样式展示如下:

    #wrap {

    text-align: center;

    width: 500px;

    margin: 100px auto;

    position: relative;

    }

    #img{

    width: 100px;

    height: 100px;

    margin-left: 40px;

    margin-top: 20px;

    }

    #ul1 {

    width: 303px;

    height: 303px;

    margin: 50px auto;

    padding: 0;

    border-top: 1px solid black;

    border-left: 1px solid black;

    }

    #ul1 li {

    float: left;

    border-right: 1px solid black;

    border-bottom: 1px solid black;

    list-style: none;

    width: 100px;

    height: 100px;

    line-height: 100px;

    text-align: center;

    }

    #tooltips {

    width: 100%;

    height: 100%;

    background-color: rgba(0, 0, 0, 0.5);

    position: absolute;

    top: 0;

    z-index: 999;

    display: none;

    }

    #info {

    width: 400px;

    height: 200px;

    background-color: white;

    margin: 150px auto;

    position: relative;

    }

    #info .title {

    width: 100%;

    height: 40px;

    background-color: #009f95;

    line-height: 40px;

    color: white;

    padding-left: 20px;

    box-sizing: border-box;

    }

    #info .btn button {

    background-color: #009f95;

    color: white;

    outline: none;

    font-size: 10px;

    width: 60px;

    height: 30px;

    margin-left: 300px;

    }

    #info .content {

    position: absolute;

    top: 95px;

    left: 190px;

    box-sizing: border-box;

    }

    HTML代码:

    开始抽奖

    • 电脑
    • 100万
    • 很遗憾~
    • 很遗憾~
    • 键盘
    • iphoneX
    • 100元购物卷
    • 王者2日游
    • 很遗憾~
    信息

    love.png

    确定

    抽奖弹出框效果:

    e2798342104e

    image

    谈谈写的时候遇到的坑吧。写js时,获取随机中奖数字和遍历的索引,两者容易出现bug,特别取余之后。另外还有就是循环次数,也就是通过循环的li标签来控制,这三者间要么背景色对不上内容,要么直接无线循环了。js展示如下:

    var oBtn = document.getElementById('btn');

    var aLi = document.getElementsByTagName('li');

    var oTooltips = document.getElementById('tooltips');

    var oConfirm = document.getElementById('confirm');

    var oContent = document.getElementById('content');

    var oImg = document.getElementById('img');

    var nowIndex = 0;//定义滚动指定的li

    oBtn.onclick = function(){

    var number = getRandom(10,28);//获取中奖随机号码

    //抽奖背景切换

    var scrollLi = setInterval(function(){

    console.log(number)

    colorChange(aLi,nowIndex);

    nowIndex++;

    //中奖or为中奖内容设置

    if(nowIndex==number)

    {

    clearInterval(scrollLi);

    oTooltips.style.display = "block";

    if(aLi[nowIndex%9].innerHTML=="很遗憾~"){

    oContent.innerHTML ='sorry~ 大明 ' + aLi[nowIndex%9].innerHTML;

    oImg.src="img/fool.png"

    nowIndex = 0;

    }else{

    oContent.innerHTML ='恭喜~ 大明 获得了' + aLi[nowIndex%9].innerHTML;

    oImg.src="img/love.png"

    nowIndex = 0;

    }

    }

    },100)

    }

    //改变颜色

    function colorChange(aLi,nowIndex){

    //把所有li背景设置为白色

    for (var i= 0;i

    aLi[i].style.backgroundColor = "white"

    }

    //背景

    aLi[(nowIndex+1)%9].style.backgroundColor = "red";

    }

    //点击确认后消失

    oConfirm.onclick = function(){

    oTooltips.style.display = "none";

    }

    //获取随机获奖数字

    function getRandom(min,max){

    return Math.floor(Math.random()*(max-min+1) + min)

    }

    基本抽奖功能实现了,但可能代码不是很标准,欢迎评论讨论讨论,共同进步!!!

    展开全文
  • vue实现抽奖

    千次阅读 2021-11-12 09:21:08
    vue实现宫格轮转抽奖(类似穿越火线的xx轮回) 不做过多的解说,直接上代码啦。关键的代码都写了注释,很容易理解。直接复制即可使用! 另外css部分依赖 node-sass、sass-loader,没有安装的安装一下,已有的小伙伴直接...
  • 实训 jQuery开发交互效果页面--手机号抽奖.pptx
  • 本文从头开发教你开发一个带滚动效果的抽奖软件。 软件开发的第一步是需求分析,其实好的开发人员就是半个产品经理,我相信很多开发者都被产品经理坑过,需求一变在变,所以我们要在开发之前就把需求问清楚,越细越...
  • Vue 九宫格抽奖实现

    2022-06-24 14:15:45
    Vue实现九宫格抽奖
  • 前端HTML手机号抽奖案例(jQuery)

    千次阅读 2021-07-04 19:11:23
    <!... <... <...手机号抽奖</title> <style> p{ width: 100px; position: relative; } </style> </head> <script src="js/jquery3.4.1.js
  • 一个抽奖小程序,概论可控,也可某个奖品在前端显示,而程序中根本不可能获得!把所有的概率x10后相加起来,新数组中每项的值等于它前几个的和加上它本身
  • H5活动抽页面模板

    2020-08-27 09:41:23
    采用jQuery+ajax 实现首页、阶梯抽奖、获奖用户排行榜、邀请好友列表页及徒弟排行榜、活动介绍等等。
  • 扭蛋抽奖--页面+css

    2019-01-12 17:07:16
    jQuery + css3 制作点击按钮开始扭蛋机抽奖,弹出抽奖结果效果代码。
  • JS实现一个简单的抽奖页面

    千次阅读 2021-03-09 08:37:27
    一个简单的基于javascript开发出来的抽奖页面,自己也可以diy一个抽签页面,选择恐惧症必备!!!
  • 用Javascript制作抽奖页面,简单实用
  • 效果: 代码: ...在线抽奖 随机选取 自动挑选</title> <script src="https://libs.baidu.com/jquery/1.10.2/jquery.min.js"></script> <style> body { background-color:al
  • 主要为大家详细介绍了用jQuery旋转插件jqueryrotate制作转盘抽奖,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
  • web实例(一):抽奖

    2021-07-11 00:52:08
    Document 开始抽奖 停止抽奖 中奖名单:
  • Html页面抽奖系统

    2014-11-07 16:04:35
    一个使用javascript制作的可以随机名字和图片的 页面抽奖系统,修改里面图片和页面javascript属性名字即可使用自己名字图片!
  • 微信小程序的抽奖页面

    千次阅读 2020-03-04 13:04:28
    微信小程序的抽奖页面 做一个1-10的微信小程序抽奖界面,随机到6和8会显示中奖信息! 点开始按钮开始执行,点结束按钮结束抽奖并且判断是否中奖 wxml代码: <view>{{title}}</view> <view bindtap=...
  • 刮刮卡需求:1.每一位用户有三次刮刮卡的机会2.本次刮刮卡的结果会覆盖上次的结果3.刮刮卡的中奖几率呈现为递增的曲线(保证三次中必须有一次...我们自己的需求,今天就说怎么制作刮刮卡,有这样需求的可以找我要源码
  • 可控式强制更新(用户可自己写网页,放网盘等),版本检测,打开下载页面等 通过规则设置,控制评论内符合抽奖的条件,可排除未关注者(因系统限制100名内)、必须佩戴粉丝勋章且等级>=()、重复评论仅保留最新或...
  • 内容 1、让读者有理由逗留。要把网页作得趣味盎然,...这样做的一个很简单的办法是提供相互参与——让读者做一些事情,如报名获取定期发送的通讯,并用某种方式报答他们的参与,如每周抽奖或给予下载一些东西的机会。
  • 文章通过HTML+JS+CSS+PHP+MySQL,制作了一个九宫格抽奖页面,用户抽奖完成后将抽奖结果提交的表单上传至数据库,这里上传一份整合后的最终源码。 配套文章地址: 【抽奖平台开发(1)HTML+JS+CSS】抽奖功能的前端...
  • 使用jquery实现抽奖页面

    千次阅读 2019-05-20 14:51:08
    使用jquery实现抽奖页面

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 2,434
精华内容 973
关键字:

抽奖页面制作

友情链接: svmmatla3.rar