Important: This documentation covers Yarn 1 (Classic).
For Yarn 2+ docs and migration guide, see yarnpkg.com.

Package detail

ani-cursor

captbaritone2.4kMIT0.0.5TypeScript support: included

Render .ani cursors as CSS animations in the browser

readme

ani-cursor

A library for rendering Windows Animated Cursor files (.ani) in the browser by parsing out the individual frames and constructing a CSS animation.

Built to support .ani files in Winamp skins for https://webamp.org.

I wrote a blog post about this library which you can find here.

Install

yarn add ani-cursor

or

npm install ani-cursor

Usage Example

import {convertAniBinaryToCSS} from 'ani-cursor';

async function applyCursor(selector, aniUrl) {
    const response = await fetch(aniUrl);
    const data = new Uint8Array(await response.arrayBuffer());

    const style = document.createElement('style');
    style.innerText = convertAniBinaryToCSS(selector, data);

    document.head.appendChild(style);
}

const h1 = document.createElement('h1');
h1.id = 'pizza';
h1.innerText = 'Pizza Time!';
document.body.appendChild(h1);

applyCursor("#pizza", "https://archive.org/cors/tucows_169906_Pizza_cursor/pizza.ani");

Try the Live Demo on CodeSandbox.

changelog

Changelog for ani-cursor

0.0.5

Bug Fixes

  • Allow the parser to find frames inside the info chunk. I believe cursors made using http://take1.de put the frame info there.

0.0.4

Initial Published Release