AnimatePNG
Allows you to create an animated PNG using frame sprites
Install / Use
/learn @pixelmatrix/AnimatePNGREADME
h1. animatePNG
A simple plugin to create an animation from a PNG file with frame-based sprites with jQuery.
For those times when you want to use a spinner or loading animation but need it to be alpha transparent. That's just one example. The possibilities are endless.
h2. Usage
@$("#container").animatePNG(imageURL, width, height, frames, options);@
Creates an animated div with a class of animation inside of the specified container.
h2. Example
bc. $(function(){ $("#container").animatePNG("/images/animation.png", 100, 100, 8, {fps: 20, horizontal: false}); });
h2. Parameters
imageURL string : URL path to the image to be animated width integer : width in pixels of the image frame height integer : height in pixels of the image frame frames integer : number of frames in animation options object : a hash of additional options
h3. Options
fps integer : number of frames per second (approximately) to show. affects the speed of the animation. horizontal boolean : true if your animation sprites go left to right, false if your animation sprites go top to bottom.
Related Skills
node-connect
348.5kDiagnose OpenClaw node connection and pairing failures for Android, iOS, and macOS companion apps
frontend-design
109.1kCreate distinctive, production-grade frontend interfaces with high design quality. Use this skill when the user asks to build web components, pages, or applications. Generates creative, polished code that avoids generic AI aesthetics.
openai-whisper-api
348.5kTranscribe audio via OpenAI Audio Transcriptions API (Whisper).
qqbot-media
348.5kQQBot 富媒体收发能力。使用 <qqmedia> 标签,系统根据文件扩展名自动识别类型(图片/语音/视频/文件)。