A React component providing a cropped view for large contents and making it draggable.
NOTICE: This module is still alpha quality.
npm install --save react-cropview
Please check out example directory.
It's very simple. Just wrap your content with <CropView>
component.
import CropView from 'react-cropview';
// ...
render() {
return <div>
<Cropview width={320} height={240}>
<img src="large.jpg" alt="image" />
</Cropview>
</div>:
}
name
(string
):width
(string
|number
) [required] :height
(string
|number
) [required] :constraint
(boolean
): Prevent over dragging. Default istrue
.centering
(boolean
): Centering content in default. Default istrue
.measureOn
(string
):hover
ormount
. Default ismount
.
npm install
npm run build
npm start
Open http://localhost:8080/webpack-dev-server/
for auto-reloading.
If you want to debug with React Dev Tools, http://localhost:8080/
will be preferred.
See the Releases page on GitHub.
MIT
Yuki Kodama / @kuy