简单抽奖活动js代码

代码如下：（兼容Firefox和ie）
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Document</title><style type="text/css">.wrapper{width:600px;margin:0 auto;text-align: center;}.start {padding: 30px; font:36px '微软雅黑';color:#f00;}.btns span{display: inline-block;width: 220px;height: 30px;line-height: 30px;background-color: #e6e6e6;cursor: pointer;margin:0 10px;}</style>
</head>
<body>
<div class="wrapper"><!-- 开始抽奖 --><div class="start" id="name">礼品随机挑选!</div><!-- 开始结束按钮 --><div class="btns"><span id="start">开始</span><span id="end">结束</span></div>
</div>
<script type="text/javascript">var giftlist=['iphone7','mackbook','马尔代夫三日游','美迪拉克','bmw','自行车'],timer=null,flag=0;var name=document.getElementById('name'),startplay=document.getElementById('start'),endplay=document.getElementById('end');      window.οnlοad=function(){// 开始事件startplay.οnclick=playfun;// 停止结束事件endplay.οnclick=stopfun;// 键盘事件document.οnkeyup=function(event){event=event||window.event;if(event.keyCode==13){if(flag==0){playfun();flag=1;}else{stopfun();flag=0;}}}}function playfun(){var name=document.getElementById('name'),startplay=document.getElementById('start');clearInterval(timer);timer=setInterval(function(){var ran=Math.floor(Math.random()*giftlist.length);// console.log(giftlist[ran]);name.innerHTML=giftlist[ran];},50)startplay.style.backgroundColor='#f00';}function stopfun(){clearInterval(timer);startplay.style.backgroundColor='#e6e6e6';}
</script>
</body>
</html>

简单抽奖活动js代码相关推荐

wpf-调用简单的js代码
本来是想调用复杂js代码的(懒得看懒得重写),结果引用的时候发现要改很多,所以放弃了.这里暂时记录下: 添加引用 c#调用js代码需要添加一个com引用:Microsoft Script Contro ...
简单三行JS代码实现滑动门
js 脚本 /* * $id:common.js * @function switchTab 通用滑动门程序(简) * @usage <span id="Tab_" onmo ...
js判断最后一个字符是不是指定字符_结合简单的 JS 就可以让 CSS 也能做搜索
是的,结合简单的 JS 代码就可以让 CSS 做当前页面的搜索引擎.效果大概就是这样: 其实呢这个是很早之前我就整了,用来给自己的一些无聊的 demo 或者瞎折腾玩的页面做索引搜索的.页面不多,但有时 ...
只用js代码实现电子时钟，精确到毫秒
效果如下: 完整代码详解如下: <!DOCTYPE html> <html lang="en"> <head><meta charset= ...
js php滚动图代码,JavaScript_JS实现的N多简单无缝滚动代码(包含图文效果)，本文实例讲述了JS实现的N多简 - phpStudy...
JS实现的N多简单无缝滚动代码(包含图文效果) 本文实例讲述了JS实现的N多简单无缝滚动代码.分享给大家供大家参考,具体如下: 实现原理很简单,注册事件之后,立即将元素的innerHTML累加一次. ...
php简单网页制作代码,用HTML和CSS以及JS制作简单的网页菜单界面的代码
这篇文章主要介绍了使用HTML+CSS+JS制作简单的网页菜单界面,这个ABROAD项目所使用的JavaScript部分代码非常简单,需要的朋友可以参考下写ABROAD项目用到了标签这个东东,其实标 ...
web前端学习基础教程，简单的图片旋转木马自动轮播js代码
一款简单的图片旋转木马自动轮播js代码,图片叠加轮播切换效果,支持点击左右箭头按钮控制切换. 案例效果图案例源码: <!DOCTYPE html> <html lang=" ...
日历签到html,简单的手机移动端日历签到js代码
特效详情: 一款简单的手机移动端日历签到js代码,挺不错的手机签到页面,可自定义已签到日期,连续几天签到代码. js代码 var isSign = false; var myday = new Arr ...
html网页加减乘除代码,html+js实现简单的计算器代码(加减乘除)
html+js实现简单的计算器代码(加减乘除) function setOp(op, opTips) { var tb=document.getElementById("tb_calc&qu ...

简单抽奖活动js代码

简单抽奖活动js代码相关推荐

最新文章

热门文章