2.0.1 • Published 7 years ago
react-fadethrough v2.0.1
react-fadethrough
A simple react module that will wrap and fade through it's children one by one. Example: http://sunyang713.github.io/react-fadethrough
Installation
npm install --save react-fadethrough
Usage
Wrap elements of any kind inside an enclosing Fadethrough component. The Fadethrough will iterate over and fade-transition through the components. The Fadethrough comopnent can take an optional width, optional height, or optional interval period.
Props
- width: a string equivalent to the CSS height property. Default: '100%'.
- height: a string equivalent to the CSS height property. Default: '100%'.
- interval: a number representing the interval time in milliseconds between each element. Default: 3000.
import Fadethrough from 'react-fadethrough'
/* . . . */
// in your render function
<Fadethrough width={ '800px' } height={ '400px' } interval={ 5000 }>
<img src={ one } width="800" height="400" />
<img src={ two } width="800" height="400" />
<img src={ three } width="800" height="400" />
</Fadethrough>
Fadethrough can handle any kind of child component.
import Fadethrough from 'react-fadethrough'
/* . . . */
// in your render function
<FadeThrough>
<h1>{ 'hello!' }</h1>
<div style={ { backgroundImage: 'url(' + myImage + ')' } } />
<p>{ 'test test test test' }</p>
<p>{ 'test 123' }</p>
<img src={ three } width="800" height="400" />
</FadeThrough>
License
MIT
2.0.1
7 years ago
2.0.0
8 years ago
1.3.4
9 years ago
1.3.3
9 years ago
1.3.2
9 years ago
1.3.1
9 years ago
1.3.0
9 years ago
1.2.2
9 years ago
1.2.1
10 years ago
1.2.0
10 years ago
1.1.9
10 years ago
1.1.8
10 years ago
1.1.7
10 years ago
1.1.6
10 years ago
1.1.5
10 years ago
1.1.4
10 years ago
1.1.3
10 years ago
1.1.2
10 years ago
1.1.1
10 years ago
1.1.0
10 years ago
1.0.6
10 years ago
1.0.5
10 years ago
1.0.0
10 years ago