V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
爱意满满的作品展示区。
kylebing
V2EX  ›  分享创造

助力 520,一个飘心的背景 canvas, web

  •  
  •   kylebing ·
    KyleBing · 2023-05-19 17:41:25 +08:00 · 1258 次点击
    这是一个创建于 582 天前的主题,其中的信息可能已经有所发展或是发生改变。

    520 ,突然看到自己之前弄的一个心形背景,感觉有点用处,分享一下

    pic

    演示

    1. 暗底五彩
    2. 白底红心
    3. 登录页

    用法

    yarn add animate-heart-canvas
    # 或
    npm i animate-heart-canvas
    
    import {AnimateHeartCanvas} from "animate-heart-canvas";
    
    mounted() {
        this.animatedBg = new AnimateHeartCanvas(0, 360, 250, 20, 50, '#eee')
    },
    beforeDestroy() {
        this.animatedBg.destroy()
    }
    

    参数

    • hMin – 颜色 h 最小值
    • hMax – 颜色 h 最大值
    • countHeart – 心的数量
    • sizeMin – 心形最小值
    • sizeMax – 心形最大值
    • bgColor – 背景颜色
    3 条回复    2023-05-20 16:07:12 +08:00
    qinfengge
        1
    qinfengge  
       2023-05-19 17:56:52 +08:00   ❤️ 1
    让我有一种某宝买了个 “女朋友感动哭了” 东西的感觉🤡
    brust
        2
    brust  
       2023-05-19 20:15:02 +08:00   ❤️ 1
    分手小妙招
    hymxm
        3
    hymxm  
       2023-05-20 16:07:12 +08:00
    挺棒的
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   2515 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 22ms · UTC 10:52 · PVG 18:52 · LAX 02:52 · JFK 05:52
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.