# ds-delay-loader

Latest version **0.0.0** (published 2018-08-13) · MIT license · 0 weekly downloads

## Install

```sh
npm install ds-delay-loader
pnpm add ds-delay-loader
yarn add ds-delay-loader
bun add ds-delay-loader
```

## Health

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

Positive: no vulnerabilities.

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

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.0.0 |
| Published | 2018-08-13 |
| First published | 2018-08-13 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 0 |
| Unpacked size | 7.3 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Author | Daiki Saito |
| Maintainers | dsflon |
| Keywords | delay loader, js, library, ECMA script, not jQuery |

## Links

- npm: https://www.npmjs.com/package/ds-delay-loader
- npm.io page: https://npm.io/package/ds-delay-loader

## Alternatives

- [@mapbox/jsonlint-lines-primitives](https://npm.io/package/@mapbox/jsonlint-lines-primitives.md) — 5.3M weekly downloads
- [reftools](https://npm.io/package/reftools.md) — 3.5M weekly downloads
- [@hey-api/openapi-ts](https://npm.io/package/@hey-api/openapi-ts.md) — 3.5M weekly downloads
- [@mapbox/geojson-rewind](https://npm.io/package/@mapbox/geojson-rewind.md) — 2.4M weekly downloads
- [turbo-stream](https://npm.io/package/turbo-stream.md) — 1.7M weekly downloads

## Recent versions

- 0.0.0 (latest) — 2018-08-13

## README

# ds-delay-loader ( Don't Need jQuery )


ds-delay-loader.jsは、jQueryを必要としないスクロールをトリガーとした画像の遅延ロード機能を実装します。
- Target browser : IE9+

___

# Install

```
npm i ds-delay-loader -S
```

___

# Import

```
import DsDelayLoader from 'ds-delay-loader';
```

___

# Constructor

```
new DsDelayLoader(element [, option]);
```
|Argument|Data type|Default|Descroption|
|:-------|:--------|:------|:----------|
|element|String|-(Required)|対象要素を指定します。<br>ex) ".delayloader img"|
|option|Object|-|ex)<br> option = {<br> transitionSpeed: 400,<br> delaySpeed: 400,<br> threshold: 200,<br> bg: "url(img/loading.gif)"<br>}|

|option|Data type|Default|Descroption|
|:-------|:--------|:------|:----------|
|transitionSpeed|Number|200|画像が表示されるスピードを指定できます。|
|delaySpeed|Number|200|画像が表示される際の遅延時間を指定できます。|
|threshold|Number|200|画像表示のしきい値を指定できます。|
|bg|String|"#EEE"|グローバルナビを強制的に閉じる境界値を指定することができます。|

___

# Demo

[https://dsflon.github.io/ds-delay-loader/](https://dsflon.github.io/ds-delay-loader/)

```
import DsDelayLoader from 'ds-delay-loader';

new DsDelayLoader(
    ".delayloader img",
    {
        transitionSpeed: 1000,
        delaySpeed: 200,
        threshold: 100,
        bg: "#666"
    }
);
```

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