Skip to content

Instantly share code, notes, and snippets.

@codeaholicguy
Created March 27, 2018 04:35
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save codeaholicguy/24051e0582d94a7b56eb894b8ab4646b to your computer and use it in GitHub Desktop.
Save codeaholicguy/24051e0582d94a7b56eb894b8ab4646b to your computer and use it in GitHub Desktop.
class IndexPage extends React.Component {
constructor(props) {
super(props)
this.state = {show: false}
}
_click = () => {
this.setState({show: true})
setTimeout(() => this.setState({show: false}), 1500)
}
render() {
return (
<div>
<p>
<span
style={{
fontWeight: 'bold',
color: 'purple',
cursor: 'pointer',
}}
onClick={this._click}
>
Click me
</span>
</p>
{this.state.show && (
<div
id="animation"
ref={el => (this._el = el)}
style={{
position: 'absolute',
width: '100%',
height: '100%',
top: 0,
left: 0,
}}
/>
)}
</div>
)
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment