🎲 Lottery.js 开源的 JavaScript 抽奖小应用

[unstop]

Lottery.js

📖 简介

Lottery.js 是一个简单的抽奖小应用，主要特征有：

• ✨ 界面好看
• 🍀 接口简单
• 😎 开箱即用

👀 预览

🔗 链接

LiveDemo: https://meetmore.github.io/lottery.js/

GitHub: https://github.com/meetmore/lottery.js/

💡 缘起

该功能源自 多会 为活动提供的现场抽奖大屏，如果你不仅需要一个抽奖页面，还需要活动报名、售票、现场签到等功能的话，欢迎 注册体验多会。

🙏感谢大家的评论和收藏。

如果你希望 🎲 Lottery.js 得到进一步改进，欢迎在在 HN 给 🎲 Lottery.js Upvote

https://news.ycombinator.com/item?id=15449437

或者在 GitHub 给项目加星 🌟

https://github.com/meetmore/lottery.js

v1.1 更新：

- 新增：👥 一次抽多个中奖者
- 新增：📝 中奖记录

[NekoTora]

😘👍

[assad]

😙

[garth]

在手机上看效果不太好

[unstop]

@garth 刚刚试了一下，确实有些问题…

主要考虑的应用场景是在电脑上用浏览器开全屏展示，因此没有对手机做专门的兼容。

pull requests are welcome :)

[levon]

mark

[lauix]

还好吧，一般般。

bug 挺多的。

[kurtrossel]

Richard 什么背景，每次都是他中奖？

[unstop]

@lauix 具体遇到了什么 bug ？

[levon]

@kurtrossel Boss，说明可以做手脚，好东西，哈哈

[unstop]

@kurtrossel 在录制 gif 的时候为了保证效果所以钦定了由 Richard 来拿这个奖。

[TangMonk]

美洽该升级了啊

[torbrowserbridge]

人再多点，UI 怎么处理的？

[unstop]

@torbrowserbridge 有一个自动调整头像大小的选项（ fitsize ），如果打开之后会自动缩小头像尺寸，来尽可能将所有头像展示在同一屏。

[nimingyonghu]

不错 赞一个.
但是有一点感觉很奇怪,就是感觉移动速度有点慢了,不知道速度可以设置不啊?如果只是 demo 里的速度的话,感觉手速快的人甚至可以在白圈停在某个人头像上时秒按 STOP.

另外,个人建议能否加个特效,比如白圈转动的时候,出现个遮罩什么的,只有白圈选中的人是高亮那种...

[unstop]

@nimingyonghu 很棒的想法。

刚刚加上了速度配置项和高亮效果。

[extzhou]

感觉可以借鉴过来 通过微信签到 拿到微信头像做抽奖，成功的推送模板消息到微信，另外也同样关心 @torbrowserbridge 说的头像超出一屏时候怎么处理的问题。

[unstop]

@extzhou 实际上如果是生产级别的使用可以考虑用多会的签到系统，或者用多会的微信群抽奖功能。

上面有提到，头像会自动 resize。

> 有一个自动调整头像大小的选项（ fitsize ），如果打开之后会自动缩小头像尺寸，来尽可能将所有头像展示在同一屏。

[dyxang]

如果没有头像只有名字怎么办？那显示的是什么？

[unstop]

@dyxang 目前来说，头像是必填的…

[kokdemo]

@unstop 网站的 navbar 里 点 logo 回不到主页……

[unstop]

@kokdemo 注册页面对么？这是为了提高注册转化率，故意这样设计的。

[kokdemo]

@unstop ……一脸懵 b 啊……想看一下介绍都看不到……

[unstop]

@kokdemo 因为一般用户不会直接落地在注册页面...

[torbrowserbridge]

并不适合人数很多的场景

[unstop]

@torbrowserbridge 超过 100 人的话就不太可能将所有参与抽奖的人全展示在同一屏内。

不过似乎也没有更好的解决方案？

[torbrowserbridge]

@unstop 可以在光圈跳动的时候，同时切换每个随机位置的头像

[loading]

不如直接开 concole,运行原生随机函数，即时出数据，大家都没意见。

[dyxang]

@unstop 为何不弄个默认头像？

[dyxang]

@unstop 或者像 gmail 根据用户名生成的字母头像一样弄个什么的

[dyxang]

为何不在结果之后播放一段庆祝音频？

[unstop]

@dyxang 这些想法都很棒！欢迎给我提 pull request。

[dyxang]

@unstop 但是
我没有 github 帐号
我不会 js
sorry😂

[derpc]

直接双击就可以钦定了:doge

[sheyong]

一次抽多个人呢 支持吗

[unstop]

@sheyong 目前不支持，后续可能会增加。

[unique]

这个不错，star 了

[inmyfree]

楼主，我很给力的，每个项目都点了两下 star。。。。

[only0jac]

图怎么截的？

[mfhh]

👍