V2EX 首页   æ³¨å†Œ   ç™»å½•
V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  ç™»å½•
爱意满满的作品展示区。
V2EX  â€º  分享创造

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

  •  4
     
  •   unstop · 7 天前 · 2830 次点击

    Lottery.js

    📖 简介

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

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

    👀 预览

    lottery-demo

    🔗 链接

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

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

    💡 缘起

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

    第 1 条附言  Â·  6 天前
    🙏感谢大家的评论和收藏。

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

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

    或者在 GitHub 给项目加星 🌟

    https://github.com/meetmore/lottery.js
    38 回复  |  ç›´åˆ° 2017-10-12 23:42:49 +08:00
        1
    NekoTora   7 天前
    😘👍
        2
    assad   7 天前 via Android
    😙
        3
    garth   7 天前 via iPhone
    在手机上看效果不太好
        4
    unstop   7 天前
    @garth 刚刚试了一下,确实有些问题…

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

    pull requests are welcome :)
        5
    levon   7 天前
    mark
        6
    lauix   7 天前
    还好吧,一般般。

    bug 挺多的。
        7
    kurtrossel   7 天前
    Richard 什么背景,每次都是他中奖?
        8
    unstop   7 天前
    @lauix 具体遇到了什么 bug ?
        9
    levon   7 天前
    @kurtrossel Boss,说明可以做手脚,好东西,哈哈
        10
    unstop   7 天前
    @kurtrossel 在录制 gif 的时候为了保证效果所以钦定了由 Richard 来拿这个奖。
        11
    TangMonk   7 天前
    美洽该升级了啊
        12
    torbrowserbridge   7 天前
    人再多点,UI 怎么处理的?
        13
    unstop   7 天前
    @torbrowserbridge 有一个自动调整头像大小的选项( fitsize ),如果打开之后会自动缩小头像尺寸,来尽可能将所有头像展示在同一屏。
        14
    nimingyonghu   7 天前   ♥ 1
    不错 赞一个.
    但是有一点感觉很奇怪,就是感觉移动速度有点慢了,不知道速度可以设置不啊?如果只是 demo 里的速度的话,感觉手速快的人甚至可以在白圈停在某个人头像上时秒按 STOP.

    另外,个人建议能否加个特效,比如白圈转动的时候,出现个遮罩什么的,只有白圈选中的人是高亮那种...
        15
    unstop   7 天前
    @nimingyonghu 很棒的想法。

    刚刚加上了速度配置项和高亮效果。
        16
    extzhou   7 天前
    感觉可以借鉴过来 通过微信签到 拿到微信头像做抽奖,成功的推送模板消息到微信,另外也同样关心 @torbrowserbridge 说的头像超出一屏时候怎么处理的问题。
        17
    unstop   7 天前
    @extzhou 实际上如果是生产级别的使用可以考虑用多会的签到系统,或者用多会的微信群抽奖功能。

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

    > 有一个自动调整头像大小的选项( fitsize ),如果打开之后会自动缩小头像尺寸,来尽可能将所有头像展示在同一屏。
        18
    dyxang   7 天前 via Android
    如果没有头像只有名字怎么办?那显示的是什么?
        19
    unstop   7 天前
    @dyxang 目前来说,头像是必填的…
        20
    kokdemo   7 天前
    @unstop 网站的 navbar 里 点 logo 回不到主页……
        21
    unstop   7 天前
    @kokdemo 注册页面对么?这是为了提高注册转化率,故意这样设计的。
        22
    kokdemo   7 天前
    @unstop ……一脸懵 b 啊……想看一下介绍都看不到……
        23
    unstop   7 天前 via iPhone
    @kokdemo 因为一般用户不会直接落地在注册页面...
        24
    torbrowserbridge   7 天前 via Android
    并不适合人数很多的场景
        25
    unstop   7 天前
    @torbrowserbridge 超过 100 人的话就不太可能将所有参与抽奖的人全展示在同一屏内。

    不过似乎也没有更好的解决方案?
        26
    torbrowserbridge   7 天前 via Android
    @unstop 可以在光圈跳动的时候,同时切换每个随机位置的头像
        27
    loading   7 天前
    不如直接开 concole,运行原生随机函数,即时出数据,大家都没意见。
        28
    dyxang   7 天前 via Android
    @unstop 为何不弄个默认头像?
        29
    dyxang   7 天前 via Android
    @unstop 或者像 gmail 根据用户名生成的字母头像一样弄个什么的
        30
    dyxang   7 天前 via Android
    为何不在结果之后播放一段庆祝音频?
        31
    unstop   6 天前
    @dyxang 这些想法都很棒!欢迎给我提 pull request。
        32
    dyxang   6 天前 via Android
    @unstop 但是
    我没有 github 帐号
    我不会 js
    sorry😂
        33
    derpc   6 天前
    直接双击就可以钦定了:doge
        34
    sheyong   6 天前
    一次抽多个人呢 支持吗
        35
    unstop   6 天前 via iPhone
    @sheyong 目前不支持,后续可能会增加。
        36
    unique   6 天前 via iPhone
    这个不错,star 了
        37
    inmyfree   6 天前
    楼主,我很给力的,每个项目都点了两下 star。。。。
        38
    only0jac   5 天前 via Android
    图怎么截的?
    DigitalOcean
    关于   ·   FAQ   ·   API   ·   我们的愿景   ·   广告投放   ·   鸣谢   ·   1799 人在线   最高记录 3541   ·  
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.0 · 57ms · UTC 13:05 · PVG 21:05 · LAX 06:05 · JFK 09:05
    ♥ Do have faith in what you're doing.
    沪ICP备16043287号-1