Opacity Property

The component that animates the CSS opacity property of a target Element on most browsers.

Overview

Animate the opacity property of a target element.

The KUTE.js Opacity Property component enables animation for the opacity CSS property of an Element target on most browsers.

In most cases, the best presentatation can be offered with a nice and smooth fade animation, with opacity going from 0% all the way up to to 100%.

While some components like HTML Attributes and Filter Effects do provide some similar functionality for specific Element types, this component covers all types of elements and is supported on a wide range of modern and legacy browsers alike.

Example

// fade out
let fadeOutTween = KUTE.to('selector1',{opacity:0}).start()

// fade in
let fadeInTween = KUTE.to('selector1',{opacity:1}).start()

Notes