AniX 安装和使用 AniX一款高性能的css3动画组件

程序名称:AniX 安装和使用

授权协议: BSD

操作系统: 跨平台

开发语言: TypeScript

AniX 安装和使用 介绍

AniX 是一款高性能的css3动画组件。

它非常简单和易于使用. 同时又具有很好的兼容性。

It uses the native css transition attribute, better than js simulation
animation performance. And you can also enable hardware acceleration with it.

安装和使用

快速入门使用 npm 安装和管理 NgxAni。

$ npm install anix --save

导入和使用 NgxAni 库。

import { AniX } from 'anix';


AniX.to(dom, 1, {
    x: 300,
    y: 10,
    scale: 2,
    delay: 0.5,
    onComplete: function(){
        alert("over");
    }
});

// or 
AniX.to(dom, 1, {
    "width": "200px",
    "background-color": "#ffcc00",
    "ease": AniX.ease.easeOutBack,
    "onComplete": () => {
        //STATE : COMPLETED!
        console.log("STATE : COMPLETED!");
    }
});

anix.jq.js

$('.demo').css({'left':'0px'}).to(.5, {
    'left': '500px',
    'background-color': '#ffcc00'
});
class MyComponent extends React.Component {
    constructor(props) {
        super(props);
        this.myRef = React.createRef();
        this.clickHandler = this.clickHandler.bind(this);
    }

    clickHandler(e) {
        const node = this.myRef.current;
        // animation
        AniX.to(node, 1, {
            x: 300,
            y: 10,
            scale: 2
        });
    }

    render() {
        return (
            <div>
                <div ref={this.myRef} />
                <button onClick={this.clickHandler}></button>
            </div>
        );
    }
}

AniX 安装和使用 官网

https://github.com/a-jie/AniX

相关编程语言

MuPlayer 是一款跨平台、轻量级的音频播放解决方案,...
OS FLV 是一个 开源和可嵌入网页的flv播放器。 这个...
DewPlayer音乐播放器,样式很简单,而且很实用.播放器...
JW FLV MEDIA PLAYER是一个开源的在网页上使用的Fla...
Speakker 是一个基于 Web 浏览器的音乐播放器,只提...
Player Framework 是一个开源的支持 HTML5 的视频播...