ract.js

produce animation with functional programming

---

English | 中文

Notice:

ract.js is in its infancy.

Welcome your suggestion to me with issue or email

---

Installation

npm:

npm install --save ractjs 

Browser:

Mainstream browsers such as chrome and firefox already support import natively

<script type="module">
    import { r, act } from "https://unpkg.com/ractjs/index.js";
</script>

how to use ract.js in native html and javascript ? 👉 [code][demo]

Document

GET START

API DOC

Example

Example1：Fade in and out

You can check and run the completed App.vue in Playground

or , check the completed App.vue in Github

r(ball).act(acts.FADE_OUT).act(acts.FADE_IN);

---

Example2：Zoom

You can check and run the completed App.vue in Playground

or , check the completed App.vue in Github

// App.vue
// ...
// key code
r(ball)
    .act({
        transform: 'scale([1~2])',
        duration: 2000,
    })
    .act({
        transform: 'scale([2~1])',
        duration: 2000,
    });
//...

---

Example3：Drop simulation

You can check and run the completed App.vue in Playground

or , check the completed App.vue in Github