tctip是一个js插件,作用是在web网页右侧生成一个打赏浮动窗
使用方法
页面使用(多数人的使用方式)
第一步,引入js
一般引入min版本,即引入tctip-版本号.min.js
文件
在当前项目中即dist/tctip-1.0.3.min.js
- 您可以把此js文件下载到您的服务器合适目录进行引用
- 您也可以直接使用我提供的静态链接
http(s)://static.tctip.com/tctip-1.0.3.min.js
<script src="//static.tctip.com/tctip-1.0.3.min.js"></script>
第二步,新建tctip变量,同时传入配置参数,然后运行init函数(将这段变量放置到js部分的最后一段)
new tctip({
top: '20%', button: { id: 9, type: 'dashang', }, list: [ { type: 'alipay', qrImg: './images/alipay.jpg' }, { type: 'wechat', qrImg: './images/wechat.jpg' }, { type: 'bitcoin', qrContent: '1PhQySHF1ZuoRwoZ8G4CDLEtE6fAnD3GJP' } ] }).init()
参数说明
-
top
类型
: String默认值
:10%
含义
: 插件顶端距离页面最上面的距离备注
: 格式如100px
或者10%
-
button
类型
: Object,包含id
和type
两个子数组id
:类型
: Number默认值
:1
含义
: 代表图片颜色备注
: 取值范围为1-9
type
:类型
: String默认值
:dashang
含义
: 按钮上的汉字,有打赏
和赞助
两种备注
: 只能取dashang
或者zanzhu
-
list
类型
: Array默认值
: []含义
: 重点配置,右侧打赏显示,不能为空备注
: 一个数组,最多传入五个元素,每个元素又有如下几项陪配置type
:类型
: String默认值
: 无含义
: 打赏类型备注
: 系统自带四种默认type,alipay
,wechat
,bitcon
,tenpay
,如果不是这四种,可以随意写
qrImg
:类型
: String默认值
: 无含义
: 二维码图片地址备注
: 尽量裁剪图片周边的空白。重要但是非必传
qrContent
:类型
: String默认值
: 无含义
: 二维码内容备注
: 和qrImg
二者必须传一个。如果传入本参数,插件自动生成二维码
icon
:类型
: String默认值
: 无含义
: 图标,列入支付宝图标备注
: 当type为系统默认四种之一时,本参数可省略
name
:类型
: String默认值
: 无含义
: 支付名称,例如支付宝、微信等备注
: 当type为系统默认四种之一时,本参数可省略
desc
:类型
: String默认值
: 无含义
: 二维码下面的一句短语,类似大爷行行好
之类的备注
: 当type为系统默认四种之一时,本参数可省略
-
stat
类型
: Boolean默认值
: true含义
: 是否上报,用于作者统计使用者备注
: 本参数只是方便作者统计插件使用情况,可视情况关闭
本文转自https://github.com/greedying/tctip 如有侵权请联系Mr.xu。