为什么使用水印？
版权问题！防止他人滥用、转发、以及破坏个人或企业隐私。
实例展示
-
注：按F12可在浏览器预览 -
示例demo源代码(H5)：
典型项目应用案例
- 【大联动】 用户信息详情页面
依赖资源
js/watermark.js水印核心基类
配置和使用方法
DOM结构
无
初始化
以下代码是最简单的用法，更多复杂用法请参考showcase_watermark
// 实例化new WaterMark({ watermark_txt: "姓名"});复制代码 参数说明
| 参数 | 参数类型 | 说明 |
|---|---|---|
| watermark_txt | string | 可选 水印字样 默认为水印字样 |
| watermark_x | string | 可选 水印起始位置x轴坐标 默认为20 |
| watermark_y | string | 可选 水印起始位置Y轴坐标 默认为20 |
| watermark_rows | string | 可选 水印行数 默认为480 |
| watermark_cols | string | 可选 水印列数 默认为8 |
| watermark_x_space | string | 可选 水印x轴间隔 默认为20 |
| watermark_y_space | string | 可选 水印y轴间隔 默认为10 |
| watermark_color | string | 可选 水印字体颜色 默认为#000000 |
| watermark_alpha | string | 可选 水印透明度 默认为0.2 |
| watermark_fontsize | string | 可选 水印字体大小 默认为14px |
| watermark_font | string | 可选 水印字体 默认为fantasy |
| watermark_width | string | 可选 水印宽度 默认为50 |
| watermark_height | string | 可选 水印长度 默认为40 |
| watermark_angle | string | 可选 水印倾斜度数 默认为20 |
参考
-
cavas绘制水印：
-
给图片加水印：