https://github.com/postor/text-water-mask
单元素实现页面水印，支持 react | single element text water mask, that supports react
https://github.com/postor/text-water-mask
Last synced: 2 months ago
JSON representation
单元素实现页面水印，支持 react | single element text water mask, that supports react
- Host: GitHub
- URL: https://github.com/postor/text-water-mask
- Owner: postor
- Created: 2021-04-19T01:35:53.000Z (about 4 years ago)
- Default Branch: main
- Last Pushed: 2021-06-01T06:26:45.000Z (almost 4 years ago)
- Last Synced: 2025-02-28T22:16:32.664Z (3 months ago)
- Language: TypeScript
- Homepage: https://postor.github.io/text-water-mask/
- Size: 1.66 MB
- Stars: 0
- Watchers: 3
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# text-water-mask
支持 js 和 react 的文本水印 | text water-mask for js and react
高性能 | high performance
- 仅使用一个 div | single div element
- 没有事件侦听自动适应父容器 | without listeners
可定制 | fully customizable
- mask div | mask div
- 平铺背景 svg 定制 | background svg
- svg text 元素定制 | svg text element
## 使用 | usage
umd
```
document.body.appendChild(TextWaterMask.default({ text: 'hello world!!' }))
```
commonjs
```
const textWaterMask = require('text-water-mask').default
document.body.appendChild(TextWaterMask.default({ text: 'hello world!!' }))
```
react umd
```
let d = React.createElement, C = ReactTextWaterMask.default
ReactDOM.render(d('div', { style: { position: 'relative' } },
d('input'), d('p', null, `hello world!`),
d(C, { text: 'hello react!' })
), document.body)
```
react commonjs
```
import ReactTextWaterMask from 'text-water-mask/dist/react'
ReactDOM.render(
hello world!
,document.body)
```
体验 | try yourself
https://postor.github.io/text-water-mask/