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');
require('rc-texty/assets/index.css');

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.