Security News
Cloudflare Adds Security.txt Setup Wizard
Cloudflare has launched a setup wizard allowing users to easily create and manage a security.txt file for vulnerability disclosure on their websites.
css-animation
Advanced tools
The css-animation npm package provides utilities for handling CSS animations and transitions in JavaScript. It simplifies the process of adding, removing, and managing CSS animations and transitions programmatically.
Add CSS Animation
This feature allows you to add a CSS animation to an element. The 'fade-in' animation is applied to the element, and a callback function is executed once the animation is complete.
const cssAnimation = require('css-animation');
cssAnimation.addAnimation(element, 'fade-in', () => {
console.log('Animation complete');
});
Remove CSS Animation
This feature allows you to remove a CSS animation from an element. The 'fade-in' animation is removed from the element.
const cssAnimation = require('css-animation');
cssAnimation.removeAnimation(element, 'fade-in');
Add CSS Transition
This feature allows you to add a CSS transition to an element. The 'width 2s' transition is applied to the element, and a callback function is executed once the transition is complete.
const cssAnimation = require('css-animation');
cssAnimation.addTransition(element, 'width 2s', () => {
console.log('Transition complete');
});
Remove CSS Transition
This feature allows you to remove a CSS transition from an element. The 'width 2s' transition is removed from the element.
const cssAnimation = require('css-animation');
cssAnimation.removeTransition(element, 'width 2s');
animate.css is a popular library that provides a collection of ready-to-use, cross-browser animations for use in your web projects. Unlike css-animation, which focuses on programmatically managing animations and transitions, animate.css provides predefined CSS classes for animations.
velocity-animate is a fast and feature-rich JavaScript library for animating DOM elements. It offers more control and performance optimizations compared to css-animation, and it supports both CSS and JavaScript animations.
animejs is a lightweight JavaScript animation library with a simple, yet powerful API. It allows for complex animations and supports various animation types, including CSS properties, SVG, and DOM attributes. It provides more advanced animation capabilities compared to css-animation.
make css animation easier
npm install
npm start
http://localhost:9001/examples/
online example: http://yiminghe.github.io/css-animation/build/examples/
var anim = require('css-animation');
anim(el,animationName,function(){});
name | type | default | description |
---|---|---|---|
el | DOMElement | dom element to be animated | |
animationName | String | will add animationName as class to el,then setTimeout 0 to add ${animationName}-active to el | |
callback | Function | triggered when anim caused by animationName is done |
http://localhost:9001/tests/runner.html?coverage
css-animation is released under the MIT license.
FAQs
css-animation
The npm package css-animation receives a total of 381,700 weekly downloads. As such, css-animation popularity was classified as popular.
We found that css-animation demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
Cloudflare has launched a setup wizard allowing users to easily create and manage a security.txt file for vulnerability disclosure on their websites.
Security News
The Socket Research team breaks down a malicious npm package targeting the legitimate DOMPurify library. It uses obfuscated code to hide that it is exfiltrating browser and crypto wallet data.
Security News
ENISA’s 2024 report highlights the EU’s top cybersecurity threats, including rising DDoS attacks, ransomware, supply chain vulnerabilities, and weaponized AI.