Sal Js

Sal (Scroll Animation Library) was created to provide a performant and lightweight solution for animating elements on scroll.

Animations

In sal.js you can easily change animation’s options, by adding a proper data attribute:

• data-sal-duration – changes the duration of the animation.
• data-sal-delay – adds delay to the animation.
• data-sal-easing – sets easing for the animation.

For example:

< div data-sal="slide-up" 
     data-sal-delay="300" 
     data-sal-easing="ease-out-bounce" >
< /div >

The library supports several animations:

• fade
• slide-up
• slide-down
• slide-left
• slide-right
• zoom-in
• zoom-out
• flip-up
• flip-down
• flip-left
• flip-right

You can set options during Sal’s initialization, e.g.:

sal({
  threshold: 1,
  once: false,
});

License

Created by Mirosław Ciastek. Released under the MIT License.
 

Demo File Sal.js