rc-texty

React TextyAnim Component

Example

http://localhost:8010/examples/

online example: http://react-component.github.io/texty/

install

Usage

var TextyAnim = require('rc-texty');
var React = require('react');
React.render(<TextyAnim>text</TextyAnim>, container);

API

props

| name | type | default | description | |-----------|----------------|-----------|----------------| | className | string | null | class name. | | prefixCls | string | texty | prefix class | | type | string | top | animation style, 'left' | 'right' | 'top' | 'bottom' |'alpha' | 'scale' | 'scaleX' | 'scaleBig' | 'scaleY' | 'mask-bottom' | 'mask-top' | 'flash' | 'bounce' | 'swing' | 'swing-y' | 'swing-rotate'. | | mode | string | smooth | animate sport mode. 'smooth' | 'reverse' | 'random' | 'sync' | | duration | number | func | 450 | Except for special animation 'flash' | 'bounce' | 'swing' | 'swing-y' | 'swing-rotate'. one text animation duration | | interval | number | func | 50 | animation interval, is function: (e: { key: string }) => number. Key is split text plus sequence(text-1). | | delay | number | 0 | animation overall delay. | | split | func | null | children split, return string |

Inherit TweenOneGroup

| name | type | default | description | |------------|----------------|---------|----------------| | appear | boolean | true | whether support appear anim | | enter | object / array / func | null | enter anim twee-one data. when array is tween-one timeline, func refer to queue-anim | | leave | object / array / func | null | leave anim twee-one data. when array is tween-one timeline, func refer to queue-anim | | onEnd | func | - | one animation end callback | | animatingClassName | array | ['tween-one-entering', 'tween-one-leaving'] | className to every element of animating | | exclusive | boolean | false | Whether to allow a new animate to execute immediately when switching. enter => leave: execute immediately leave | | component | React.Element/String | div | component tag | | componentProps | object | - | component tag props |

License

rc-texty is released under the MIT license.