Coder Social home page Coder Social logo

poison929 / birthday Goto Github PK

View Code? Open in Web Editor NEW

This project forked from ajlovechina/birthday

0.0 0.0 0.0 8.91 MB

:cake:改改数据,为心爱的人做一个超具创意的网页生日祝福吧~ (生日快乐) https://ajlovechina.github.io/birthday/

JavaScript 15.44% CSS 63.81% HTML 10.56% Less 10.19%

birthday's Introduction

生日快乐

修改config.js的配置就可以为您心爱的人做一个超具创意的网页生日快乐呀,喜欢的话fork or star一下呗~

TODO

  • 每行祝福文字可以配一张图片
  • 配图支持旋转

config.js 说明

温馨提示: 每句话丶每个图片地址丶每个按钮文字的那一行,最后都要以英文逗号结尾哦!

var config = {
    // 句子的长度可以任意, 你可以写十句话, 二十句话都可以
    // 每句话尽量不要超过15个字,不然展示效果可能不太好
    texts: [
        "送给我",
        "心爱的小可爱",
        "今天是你的生日",
        "这是我们在一起的",
        "第三个生日了哦",
        "去年的生日",
        "还记得在王婆串串吃的呢",
        "今年要吃好的喽哦",
        "要把我家可爱猪猪喂饱饱",
        "然后抱走",
        "YAMI~~",
    ],
    /**
     * imgs 可以不填, 但是如果要填写的话必须遵循下面的格式
     * "对应上面的文字, 要完全一样" : "图片地址, 可以把图片放在imgs文件夹中"
     * 例如
     * "心爱的小可爱": "./imgs/xiaokeai.jpg"
     *
     * 如果不要图片的话, 直接在每行开头写两个斜杠注释即可, 例如下面的 "今天是你的生日" 的图片就不会展示了:)
     * Tip: 图片最好用正方形or接近正方形, 看起来效果更好
     */
    imgs: {
        "心爱的小可爱": "./imgs/xiaokeai.png",
        // "今天是你的生日": "./imgs/birthday.jpg",
    },
    // 按钮文字描述, 以下是默认的按钮文字,英文的,您可以改成你喜欢的文字
    desc: {
        turn_on: "开始",
        play: "音乐",
        bannar_coming: "颜色",
        balloons_flying: "好像少点东西",
        cake_fadein: "蛋糕?",
        light_candle: "蜡烛?",
        wish_message: "生日快乐",
        story: "A MESSAGE FOR YOU",
    }
};

截图演示

知乎使用教程

https://zhuanlan.zhihu.com/p/85899661

结尾

喜欢的话关注一下霸都丶傲天呗~
定期更新一下爱情网页模板,简历模板,知识笔记,PDF书籍,原创深度技术分享等 ❤️

QA

如何修改音乐?

回答:将你自己的mp3音乐文件覆盖assets目录下面的hbd.mp3, 記住覆蓋后名字要完全一樣哦!

链接

birthday's People

Contributors

ajlovechina avatar poison929 avatar ayusharma 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.