php点名器代码_JS-点名器效果

实例

html>

Document

*{margin:0px;padding:0px;}

#box{margin:0px auto;border:1px solid greenyellow;width:666px;height:366px;text-align:center;font-size:66px;line-height:366px;}

#btn{margin:50px auto;width:200px; text-align:center;font-size:25px;color:yellowgreen;}

今晚谁陪你睡！

开始翻牌

//找对象

var box = document.getElementById('box');

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

var timmer;

//改属性

//准备一组数据   就是我们要翻牌的名字

var nameList = ['狗哥','想哥','猴哥','土申哥','旺儒哥','龙哥','杰哥','八哥','狗哥','狗哥','狗哥','狗哥','狗哥','狗哥','狗哥','狗哥','狗哥','狗哥','狗哥','狗哥','狗哥','狗哥','狗哥','狗哥',];

//让名字能动起来

function show(){

//随机下标

var num = Math.floor(Math.random()*nameList.length);

//console.log(num);

//让我们的名字显示在box div里面

box.innerHTML = nameList[num];

//让我们的名字动起来

timmer = setTimeout(show,1);

}

//show();

function doit(){

//alert(timmer);

//console.log(1);

//show();

//判断你是否是开始滚动 如果timmer等于undefined说明你需要开始滚动如果不是则需要停止

if(timmer == undefined){

show();

//修改按钮的内容

btn.innerHTML = '停止翻牌';

}else{

//清空定时器

clearTimeout(timmer);

//修改按钮的内容

btn.innerHTML = '开始翻牌';

timmer = undefined;

}

}

运行实例 »

点击 "运行实例" 按钮查看在线实例