娱乐下(个人幸福指数)转转圈

呵呵。今天高洛锋 老师在上课时点名总结昨天上课时的知识点时说到的点名的事。就突发奇想让我像个办法,最后把这个方法给想出来了。点名机。就像是老虎机一样的原理!

采用了JAVASCRIPT和 html/css 的写法,其实很简单的一个小程序!

 大家可以去试下自己的手气啊

参观地址:http://127.0.0.1/em/yuele/zhuan.html

点击查看原图

<html>
 <head>
  <title>幸福测试机</title>

  <style> 
   #dn {
    position:absolute;
    top:50%;
    left:50%;
    margin-left:-350px;
    margin-top:-200px;
    width:600px;
    height:400px;
   }

   #namelist {
    width:100%;
    height:150px;
    font-size:2cm;
    text-align:center;
    line-height:150px;
    border:5px double #060;
   }

   #but {
    width:100%;
    height:50px;
    text-align:center;
   }

   #butt {
    width:100px;
    height:40px;
    margin-top:10px;
   }
  </style>
  <style>
   body {background-color: #ECF2FD;background-image: url(bj.jpg);}
  </style>  
 </head>
 <body>
<center>
  <div id="dn">
     <h3>哈哈.娱乐娱乐!</h3>
   <div id="namelist">
    好运测试转转圈
   </div>
   
   <div id="but">
    <input id="butt" type="button" onclick="show(this)" value="开始" >
   </div> 
  </div>
<script>
 var names=["幸福","不幸福","混蛋","好人","有钱","没钱"];

 var colors=["red", "green", "yellow", "blue", "#FF00FF", "#0faff0"];

 var dt=null;
 var con=document.getElementById("namelist");
 function show(obj){
  if(obj.value=="开始"){
   dt=setInterval(function(){
     con.innerHTML=names[parseInt(Math.random()*names.length)];
     con.style.color=colors[parseInt(Math.random()*colors.length)];
    
    },1);

   obj.value="停止";
  }else{
   clearInterval(dt);
   obj.value="开始";
  }
 }

</script>
</center>
 </body>
</html>

已有 9 条评论
  1. Air Jordans

    Hello there, just became aware of your blog through Google, and found that it's truly informative. I am gonna watch out for brussels. I抣l appreciate if you continue this in future. Many people will be benefited from your writing. Cheers!

    Air Jordans 回复
  2. 虾米

    拿着哥的成果在这炫耀,蛋疼、

    虾米 回复
  3. 減肥

    想起那句话。我运气很好,脚气也不错

    減肥 回复
  4. 減肥

    枫叶红秋雨。不错的名字

    減肥 回复
  5. IzY

    那么NB....

    IzY 回复
  6. Utaoy

    好好向你学习哈

    Utaoy 回复
    1. Buy RS Gold

      @Utaoy

      Hi there to every body, it抯 my first pay a visit of this web site; this weblog includes remarkable and actually fine information in support of visitors.

      Buy RS Gold 回复
  7. 柠檬

    越来越牛了啊

    柠檬 回复
  8. 枫叶红秋雨

    {smile:29} 测试表情

    枫叶红秋雨 回复
发表新评论