Skip to content

Add onload transitions to DOM elements (fade in images etc)

Notifications You must be signed in to change notification settings

component/onload

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

9 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

onload

Add onload transitions to DOM elements that emit "load" events such as images by adding ".preload" and ".onload" classnames accordingly.

Installation

$ component install component/onload

Example

Example js:

var onload = require('onload');
var img = document.querySelector('img');
onload(img);

Example css:

img {
  opacity: 1;
  -webkit-transition: opacity 300ms;
  -moz-transition: opacity 300ms;
  transition: opacity 300ms;
}

img.preload {
  opacity: 0;
}

API

  • onload(el)

Images

Images which are .complete are immediately assigned ".onload" so that effects can be applied to non-cached images only.

License

MIT

About

Add onload transitions to DOM elements (fade in images etc)

Resources

Stars

Watchers

Forks

Packages

No packages published

Contributors 3

  •  
  •  
  •