# @kt3k/puncher

> A nice punching of characters and images.

Latest version **7.0.1** (published 2017-03-11) · MIT license · 0 weekly downloads

## Install

```sh
npm install @kt3k/puncher
pnpm add @kt3k/puncher
yarn add @kt3k/puncher
bun add @kt3k/puncher
```

## Health

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

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 7.0.1 |
| Published | 2017-03-11 |
| First published | 2016-02-13 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 0 |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 0 |
| Author | Yoshiya Hinosawa |
| Maintainers | kt3k |
| Keywords | puncher, jquery-plugin, game |

## Links

- npm: https://www.npmjs.com/package/@kt3k/puncher
- Repository: https://github.com/kt3k/puncher
- Homepage: https://github.com/kt3k/puncher#readme
- Issues: https://github.com/kt3k/puncher/issues
- npm.io page: https://npm.io/package/@kt3k/puncher

## Alternatives

- [gamedig](https://npm.io/package/gamedig.md) — 29.3K weekly downloads
- [join-monster](https://npm.io/package/join-monster.md) — 12.8K weekly downloads
- [masked](https://npm.io/package/masked.md) — 5.5K weekly downloads
- [@comunica/actor-query-process-explain-logical](https://npm.io/package/@comunica/actor-query-process-explain-logical.md) — 4.7K weekly downloads
- [@veracity/vui](https://npm.io/package/@veracity/vui.md) — 4.6K weekly downloads

## Recent versions

- 7.0.1 (latest) — 2017-03-11
- 7.0.0 — 2017-03-10
- 6.0.0 — 2017-01-22
- 5.1.0 — 2016-06-19
- 5.0.0 — 2016-05-31
- 4.0.0 — 2016-05-28
- 3.0.0 — 2016-05-11
- 2.0.2 — 2016-02-13
- 2.0.1 — 2016-02-13
- 2.0.0 — 2016-02-13

## README

# puncher v7.0.1

> Punching characters and images.

***Note*** This library depends on jquery, class-component and cc-event.

# Usage

```html
<script src="path/to/jquery.js"></script>
<script src="path/to/class-component.js"></script>
<script src="path/to/cc-event.js"></script>
<script src="path/to/puncher.js"></script>

<div class="puncher" unit-dur="120">Hello, world! <img src="foo.png" /></div>
```

This prints `Hello, world!` letter by letter and the image "foo.png". Each letter displays with 120ms delay from the previous letter. This timing is configurable with the `unit-dur` attributes of the above example. The image tag (or any other tag) counts as a single character.

### Via npm

In command line:

    npm install jquery class-component cc-event @kt3k/puncher

In script:

```js
global.jQuery = require('jquery')
require('class-component')
require('cc-event')
require('@kt3k/puncher')
```

In html:

```html
<div class="puncher" unit-dur="120">Hello, world! <img src="foo.png" /></div>
```

This prints `Hello, world!` letter by letter and the image "foo.png". Each letter displays with 120ms delay from the previous letter. This timing is configurable with the `unit-dur` attributes of the above example. The image tag (or any other tag) counts as a single character.

# API Reference

```html
<dic class="puncher" unit-dur="120"></div>
```

## Attributes

### unit-dur

`unit-dur` means the unit duration of punching of characters.

## Events

### event 'puncher.start'

When this event is triggered on the element, the punching starts.

### event 'puncher.started'

This event is triggered when the punching starts.

### event 'puncher.ended'

This event is triggered when the punching ends.

### event 'puncher.appended'

This event is triggered on the appended element when it's appended.

# LICENSE

MIT

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