karavai
TypeScript icon, indicating that this package has built-in type declarations

1.0.1 • Public • Published

Karavai JS

KaravaiJS - Images sequence scrolling engine with no dependencies

NPM

Status codecov License Deps Maintainability Issues Vulnerabilities Downloads

ZIP Size

Demo

Netlify Status

Installation

CDN

<script src="https://unpkg.com/karavai@latest/karavai.es5.js"></script>

UMD

yarn add --exact karavai
npm install --save-exact karavai

Usage

// import package. You can miss this step for CDN installation
import Karavai from 'karavai';
 
const images = [...];
const canvasRef = document.querySelector('#my');
 
const karavai = new Karavai(images, canvasRef);
 
(async () => {
  await karavai.preloadImages()
  karavai.start()
}())

Configuration

Options

const options = {
  // Number
  // images change threshold in pixels.
  // Means: every N pixels, update image to the next one
  // Default: 30
  threshold: 30
};
const karavai = new Karavai(images, canvasRef, options);
karavai.start();

API

preloadImages - preloads provided amount of images. Default: all images. Returns: Promise. Preload is not required, but strongly recommended

const karavai = new Karavai(images, canvasRef);
karavai.preloadImages(); // -> Promise

start - start karavai. It will start logic which updates images on scroll.

const karavai = new Karavai(images, canvasRef);
karavai.start();

stop - stop karavai. It will stop logic which updates images on scroll.

const karavai = new Karavai(images, canvasRef);
karavai.stop();

License

Karavai.js is freely distributable under the terms of the MIT license.

Package Sidebar

Install

npm i karavai

Weekly Downloads

36

Version

1.0.1

License

MIT

Unpacked Size

8.82 kB

Total Files

10

Last publish

Collaborators

  • igorexec