Giter Club home page Giter Club logo

luckydraw's Introduction

一个HTML+JS编写的抽签(抽奖)程序

感谢@gavinjzx(阿提)成熟的源代码与详细的注释

我@PillarsZhang(章鱼DS)fork并改进这个项目是为了班级的班队课抽签用的


以下为原版+补充的readme

把代码分享出来,有需要的朋友可载下来,修改成自己所需要的格式。

因为使用了css3 animation,所以建议使用chrome,firefox,IE10及以上(IE9及以下不支持css3 animation)。


  • 调用库:

    • js: jquery
    • css: animation
  • 文件结构:

    • \index.html 抽奖主界面
    • \js\index.js JS主程序
    • \js\lib\jquery-1.12.4.min.js jQuery文件
    • \js\lib\common.js 一些公用函数
    • \css\animate.css css3 animation库
    • \css\style.less 样式Less文件
    • \css\widget*.less style.less引用的less文件
    • \css\img\ 页面上所用到的图标文件
  • 一些个性化设置

    • \css\img\bg.png 背景图片(包括上方几个字,用PS改,PSD文件已经放在旁边了)
  • PillarsZhang所做的改进

    • \js\autozoom.js 自适应缩放
    • \js\settings.js 更改名单及相关设置
    • 是否每次抽取后把人数框清空
    • 去掉跳动的文本框的外框
    • 用unselectable="on"来去掉文本框的光标
    • 开始按钮后显示剩余人数
    • 添加一个“准备就绪”文字(改了好多诶)
    • 还有......

界面预览

在线演示:http://demo.pizyds.xyz/LuckyDraw/index.html

luckydraw's People

Contributors

jayhormes avatar pillarszhang avatar

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.