# mouse-tailing

> 屏幕鼠标拖尾效果

Latest version **0.2.0** (published 2023-08-31) · MIT license · 0 weekly downloads

## Install

```sh
npm install mouse-tailing
pnpm add mouse-tailing
yarn add mouse-tailing
bun add mouse-tailing
```

## Health

**Score 25/100 (F)** — status: abandoned.

Positive: has types; esm support; no vulnerabilities.

Warnings: low downloads; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.2.0 |
| Published | 2023-08-31 |
| First published | 2022-11-09 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Node | >=16 |
| Dependencies | 0 |
| Unpacked size | 33.7 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 1 |
| Author | s10y10 |
| Maintainers | s10y10 |
| Keywords | 拖尾, tail, background, effect |

## Links

- npm: https://www.npmjs.com/package/mouse-tailing
- Repository: https://github.com/s10y10/mouse-tailing
- Issues: https://github.com/s10y10/mouse-tailing/issues
- npm.io page: https://npm.io/package/mouse-tailing

## Alternatives

- [@sveltejs/kit](https://npm.io/package/@sveltejs/kit.md) — 2.2M weekly downloads
- [@atlaskit/theme](https://npm.io/package/@atlaskit/theme.md) — 402.0K weekly downloads
- [@tangle-network/brand](https://npm.io/package/@tangle-network/brand.md) — 10.0K weekly downloads
- [seneca](https://npm.io/package/seneca.md) — 7.4K weekly downloads
- [@bsb/base](https://npm.io/package/@bsb/base.md) — 7.2K weekly downloads

## Recent versions

- 0.2.0 (latest) — 2023-08-31
- 0.1.7 — 2023-06-28
- 0.1.6 — 2023-05-10
- 0.1.5 — 2023-03-23
- 0.1.4 — 2023-03-22
- 0.1.3 — 2023-03-20
- 0.1.2 — 2023-03-17
- 0.1.1 — 2023-03-15
- 0.1.0 — 2023-03-08
- 0.0.9 — 2023-03-02
- 0.0.8 — 2022-12-15
- 0.0.7 — 2022-11-21
- 0.0.6 — 2022-11-17
- 0.0.4 — 2022-11-09
- 0.0.3 — 2022-11-09
- … 2 more at https://npm.io/package/mouse-tailing/versions

## README

# 屏幕鼠标拖尾效果

快速实现页面中鼠标拖尾的效果

[![mouse-tailing Example](https://raw.githubusercontent.com/s10y10/mouse-tailing/master/example/example.gif)](https://github.com/s10y10/mouse-tailing)

## 安装

```
npm install --save mouse-tailing
```

## 使用
##  创建鼠标拖尾

```
import { createMouseTailing } from 'mouse-tailing'
createMouseTailing(TailConfig)
```
```
参数
export interface TailConfig = {
    // 拖尾类型 star|circle|heart|icon
    type:'star',

    // 显示拖尾用的dom容器,可以直接传一个HTMLElement对象或者一个querySelector字符串
    el:document.body,

    // 覆盖默认颜色, Hex颜色格式字符串
    color: '#FFFFFF',

    // 每次移动过程创建拖尾的数量
    count:1,

    // 拖尾存在的时间,毫秒
    duration:1000,

    // 给canvas画布一个识别用class类名
    className:'canvas-tailing'

    // 当type=icon时,需要传入icon的url
    url:'http://xxxxxx'
}
```

## 创建画布特效
```
import { createGroundEffect } from 'mouse-tailing'
createGroundEffect(EffectConfig)
```
```
参数
export interface EffectConfig extends Omit<TailConfig, 'type' | 'resource'> {
  // 效果类型 sky
  type?: EffectType;
}
```

---
_Source: https://npm.io/package/mouse-tailing · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._