原生js随机点名
- Faker
- clearlove
- theShy
- uzi
- 微笑
- 韦神
- Gogoing
- Ambition
- Froggen
- Madlife
* { padding:0; margin:0; } .content-bg { width:1365px; background:url(http://www.jq22.com/img/cs/500x300-1.png) no-repeat; background-size:cover; height:650px; background-clip:content-box; } .content { position:absolute; left:0; right:0; top:0; bottom:0; width:100%; height:650px; text-align:center; margin:0 auto; background:rgba(255,255,255,0.3); } ul { list-style:none; width:620px; margin:0 auto; overflow:hidden; } li { float:left; width:100px; border-radius:10px; background-size:cover; background-position:center; background-repeat:no-repeat; text-align:center; line-height:50px; background-color:skyblue; border:1px solid #333333; margin:10px; font-weight:bold; } button { display:block; border-radius:10px; width:80px; height:50px; margin:0 auto; background:transparent; color:skyblue; border:none; font-size:22px; color:red; } button:hover { cursor:pointer; } .active { background-color:slateblue; } .active2 { background-color:red; } .text { position:absolute; left:100px; top:50px; text-align:left; font-weight:bold; line-height:30px; } h1 { margin-bottom:50px; }
更新时间:2020-05-24 23:47:50
随机选择一个元素,并把它放入左边排行榜;
选中之后不会再次选中该元素,声明一个数组来存去所有li的下标,随机选中之后就使用splice删除数组中该元素,不影响下一次其他元素的选择
按钮自动聚焦,进入页面可直接通过键盘空格键进行控制开始和暂停,下面的按钮可换成英雄联盟的字体图标,效果更好
我也是萌新小白,希望大家一起共同学习