Skip to content

Create and trigger css transition animations from javascript

Notifications You must be signed in to change notification settings

br4nnigan/css-transition

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

16 Commits
 
 
 
 
 
 
 
 
 
 

Repository files navigation

css-transition

Animate between DOM style changes using css transitions.

Also supports a few extra transitions not currently available in vanilla css such as position (static <-> absolute/fixed) and auto values (e.g. height: auto).

About this fork

this fork simply makes the cssTransition function return a Promise.

Install

$ npm install css-transition

Example

<div id='element' style='padding:20px; background: silver; border: 1px solid gray'>
  Element with content
</div>
var cssTransition = require('css-transition')
var element = document.getElementById('element')

cssTransition(element, {
  height: '200px',
  width: '600px',
  backgroundColor: 'red'
}, 400, function(){
  console.log('animation complete')
})

Run npm run example and navigate to http://localhost:9966 to see it in action.

About

Create and trigger css transition animations from javascript

Resources

Stars

Watchers

Forks

Packages

No packages published

Languages

  • JavaScript 83.5%
  • HTML 16.5%