{"repo":"danilosetra/react-responsive-spritesheet","free":true,"listed":false,"github":"https://github.com/danilosetra/react-responsive-spritesheet","clone":"git clone https://github.com/danilosetra/react-responsive-spritesheet.git","description":"React component which helps you to easily apply responsive spritesheet animations on your project.","language":"TypeScript","stars":103,"topics":["responsive","react","spritesheet","animation","animations","npm"],"license":"MIT","category":"ui-components","readme_excerpt":"React Responsive Spritesheet Hello, world! React Responsive Spritesheet is a React component which helps you to easily apply responsive spritesheet animations on your project. See our basic example. - Installation - Usage - Options - Call methods - Requesting infos - ForwardRef usage - Examples ---------- New version 2 available! - Now you can use horizontal, vertical or multi-row spritesheet image; - Orientation parameter is no longer required; - Spritesheet image is preloaded before initialization; - The animation can be rewinded with setDirection() method and/or with direction parameter; - Direction information is provided by getInfo() method; For previous versions, see our release tags ---------- Installation ---------- Usage Basic usage with required parameters Complete usage with all parameters ---------- Options Required Parameter Type Example Description :------------: ------------ ------------ ------------ ------------ className string 'my-element class--style' Applies a classname for spritehseet container style object { backgroundColor: 'red', display: 'flex' } Applies inline style for spritehseet container &#10003; image string 'http://yyy.com/image.png' URL or path of image to animate &#10003; widthFrame number 800 Original width of each frame, in pixels &#10003; heightFrame number 800 Original height of each frame, in pixels &#10003; steps number 47 Total frames / steps present on animation image &#10003; fps number 12 Velocity / Animation frames per second &#100","default_branch":null,"files":null,"tree":[],"storefront":"/r/danilosetra","claimed":false,"request_supported":{"post":"https://gitbuyer.com/r/danilosetra/react-responsive-spritesheet/request-supported","requests":0},"note":"indexed from public GitHub; nothing is for sale on this page. Clone it from GitHub. Paid listings live at /search."}