}/*创建水印外壳div*/varotdiv =document.getElementById(defaultSettings.watermark_id);varshadowRoot =null;if(!otdiv) { otdiv =document.createElement('div');/*创建shadow dom*/otdiv.id= defaultSettings.watermark_id; otdiv.setAttribute('style','pointer-events: none !important; display: block !
watermark.js是必须要引进的组件 第一步:获取组件方式:git clone https://github.com/saucxs/watermark-dom.git 第二步:clone后,在需要加水印的相关页面引入水印文件"watermark.js": script type="text/javascript" src="./watermark.js"> 第三步:在确保页面DOM加载完毕之后,调用watermark的load方法(手动加载): ...
watermark.js是一个给B/S网站系统加水印的插件,确保系统保密性,安全性,降低数据泄密风险。简单易上手,支持多属性配置,支持本地和npm包引入,支持commonjs和es6引入。全局API有init(),load(),remove()方法。使用的是css3的pointer-events事件穿透属性和opacity透明属性,Shadow DOM(影子DOM)结构进行水印内容封装,随机...
3步教你使用watermark.js在项目中添加水印效果 使用的插件为 watermark-dom ,接下来分三步走,实现水印保护。 第一步:引入依赖包 下载依赖包: npm install watermark-dom 1 引入使用: importwatermarkfrom'watermark-dom' 1 或 varwatermarkDom =require("watermark-dom") 1 第二步:配置水印参数 水印参数配置表(...
watermark.js是基于DOM对象实现的BS系统的水印,确保系统保密性,安全性,降低数据泄密风险,简单轻量,支持多属性配置,动态计算水印,水印防被删(监听水印组件元素删除并重新添加,监听改变水印的属性并重新添加)。1、支持2种方式导入使用,2、水印插件-testTool(测试工具),3、内置3种全局API方法,等等。欢迎访问: ...
第一步:获取组件方式:git clone https://github.com/saucxs/watermark-dom.git 第二步:clone后,在需要加水印的相关页面引入水印文件"watermark.js": 第三步:在确保页面DOM加载完毕之后,调用watermark的load方法(手动加载): watermark.load({ watermark_txt: "测试水印,1021002301,测试水印,100101010111101" }) 注意...
3步教你使用watermark.js在项目中添加水印效果 项目(vue项目)涉及很多数据,为保障安全,需要对数据项目做一个前端防护——加水印! 使用的插件为 watermark-dom ,接下来分三步走,实现水印保护。 第一步:引入依赖包 下载依赖包: npm install watermark-dom
首先,你需要通过npm或yarn来安装watermark-dom库。打开你的终端或命令提示符,并运行以下命令: bash npm install watermark-dom 或者,如果你使用yarn: bash yarn add watermark-dom 在main.js中引入watermark-dom 接下来,在你的Vue 3项目的main.js文件中引入watermark-dom。这个文件通常位于项目的根目录下。 jav...
watermark.js是基于DOM对象实现的BS系统的水印,确保系统保密性,安全性,降低数据泄密风险,简单轻量,支持多属性配置,动态计算水印,水印防被删(监听水印组件元素删除并重新添加,监听改变水印的属性并重新添加)。1、支持2种方式导入使用,2、水印插件-testTool(测试工具),3、内置3种全局API方法,等等。欢迎访问: ...
1、本地引入 js 文件 第一步:在页面中引入水印文件 第二步:在确保页面 DOM 加载完毕之后,调用 watermark 方法 watermarkObj.watermark({ text: "测试水印" }) 2、npm 包引入 第一步:npm 获取水印包 npm install watermark-pub --save # yarn add watermark...