更新说明:
1.新增五款艺术收款码模板
2.更换收款二维码渲染方式为本地
3.删除四种收款样式,新增六种收款样式
4.合并两个二维码解码库,提高解码成功率
使用说明
1.下载源码,上传到自己的服务器或虚拟主机。
2.打开index.html,选择引用图片的方式,默认为引用淘宝图片,速度快。如果不想使用淘宝图片,可以使用引用本地图片方式,文件中已注明。
3.在/js/index.js中更换自己的支付宝红包码和红包口令,如不需要生成界面的红包广告则删除相关代码,文件中已标明。
添加自定义新样式:
1.添加样式背景图
①使用外部图片链接方式,如淘宝链接:上传图片到各大图床,如淘宝图床,然后获取图片链接,然后在index.html页面中 "swiper-wrapper" 类下添加代码:
<div class="swiper-slide" style="background-image:url(这是外部图片链接)" mould-name="new"></div>其中mould-name="new">中的new为自定义样式名。
②使用本地图片方式:将背景图添加到./imgs/bgimgs/ 文件夹下,文件名以 "new.png" 为例,然后在index.html页面中 "swiper-wrapper"类下添加样式:
<div class="swiper-slide" style="background-image:url(imgs/bgimgs/new.png)"></div>
其中的new也为样式名。
2.打开根目录下 config.json 文件,添加json数据,根节点名必须为样式名,如 "new",其他子节点参考下表:
这样就成功添加了一个新的样式,新增的json内容内容大致为下所示:
{ "dongxue": { "qrWidth": "364", "qrHeight": "364", "foreground": "#E3D6C6", "background": "#FFFFFF", "imgWidth": 900, "imgHeight": 1200, "font": "70px '黑体'", "fontColor": "#FFFFFF", "recNameLeft": "", "recNameTop": 178, "qrLeft": 270, "qrTop": 340 },
3.提示:如果不想在背景中生成收款名,可以将fontColor属性设为transparent。如需修改样式滑动效果,可以参考Swiper中文网文档。
发表评论