v1.1.0
π₯ Release preview
Retro-compatible release that adds support for glitching <img>
tags, support for glitching multiple elements at once, a new hideOverflow
option, an updated documentation and github actions to enforce linting and bundle max size in kb. Read more below.
π Features
- Glitch
<img>
directly. No need to add a placeholder container anymore for the animation, you can glitch existing images. Note that the recommended way to glitch images is still to add a placeholder div, but in some cases it is not possible (ex: interacting with an already built web page) - New
hideOverflow
option, defaults to false. When set to true, the animation will be hidden when outside of the animation bounding rectangle. This is typically a case-by-case value to set, as generally for pictures it will look better withhideOverflow=true
, but for images with transparent background it's best to let overflow visible. - When calling
PowerGlitch.glitch(selector)
, if the specified selector matches more than one element, all will be glitched using the same animation sequence.
π€ Changes
- Improved usage guide with comprehensive tutorial
π» Code quality
- ESLint recommended typescript/vue rules are now used
- New github action to check on every PR that linting passes and reports minified bundle size difference (2kb limit)
π Bug fixes
none