npm.io
1.3.5 • Published 4 years ago

cloudword

Licence
ISC
Version
1.3.5
Deps
0
Size
24 kB
Vulns
0
Weekly
0
SummaryDependencyVersions

自动生成云文字的工具

使用 让标题像云彩一样动起来

npm install cloudword -S

// 在 main.js 里面引用
import cloudWord from 'cloudWord'

new cloudWord({
  el: '#cloudWord',
  words: ['one', 'two', 'three'],
  colors: ['red', 'yellow', 'green'],
  onClick(elem) {
    console.log('点击的文字信息：', elem)
  }
})
配置项
名称 描述 类型 默认值 是否必填
el dom 容器 String|Document - 是
words 要渲染的标题列表 Array - 是
colors 标题所渲染出来的颜色列表 Array - 否
touchStop 是否鼠标覆盖停止 Boolean true 否
minSize 最小字体 String | Number 14 否
maxSize 最大字体 String | Number 26 否
onClick 自定义点击事件 Function - 否
api 方法
const cloudWords = new cloudWord({
  el: '#cloudWord',
  words: ['one', 'two', 'three'],
  colors: ['red', 'yellow', 'green']
})
// 添加，删除，更新
cloudWords.addWord('four');
cloudWords.removeWord(3);
cloudWords.updateWord(3, 'five');
// 刷新
cloudWords.refresh()
效果展示

git clone https://github.com/jiayunfei/cloudwords.git 下载到本地

npm install
npm run serve

打开 http://localhost:3000 就可以查看效果

Keywords

cloudWord