noloadanim
v1.0.0
Published
A simple fix for Chrome's on page load css transition bug
Downloads
4
Readme
noloadanim
A simple fix for Chrome's on page load css transition bug
If you don't know what it is, then you've not had this bug on your development stage yet, Reported here and here.
How does this approach work? Just block any transition on all the elements until the page has been fully rendered.
Install
npm install --save noloadanim
yarn add noloadanim
Usage
import React, { Component } from 'react'
import DisableOnLoadTrans from 'noloadanim'
import 'noloadanim/dist/index.css'
class Example extends Component {
render() {
return <DisableOnLoadTrans>
{
...Your components
}
</DisableOnLoadTrans>
}
}
And on Next.js (_app.js)
import DisableOnLoadTrans from 'noloadanim'
import 'noloadanim/dist/index.css'
function MyApp({ Component, pageProps }) {
return (<DisableOnLoadTrans>
<Component {...pageProps} />
</DisableOnLoadTrans>)
}
export default MyApp
License
MIT © SonicCodes