README
ReactJS Hover Component
React component that FINALLY allows you to implement the CSS hover functionality.
Install and usage
npm install react-hover-component
Example usage
import hover from 'react-hover-component'
...
render(){
return (
<hover.div
style={{height: 100,
width:100,
backgroundColor: 'red',
transitionDuration: '1s'}}
hover={{width:50}}>
<div>
...
</div>
</hover.div>
)
}
...
- You can use hover.div, hover.text, hover.img... (more to come, feel free to contribute on Github
Props
- style - OBJECT - object with styling properties. (Add the transitionDuration property to make the transition smoother). PS : The styles are applied to the child of the Hover component. The property is set to 0.3 seconds by default
- hover - OBJECT - object with styling properties that will overite those in the base style property. No need to repeat styles declared in the style prop. Just provide the new styles to apply when hovering.