Cropper: Cropper in Boostrap Modal - Small image/cropper preview

Created on 28 Oct 2016 · 5Comments · Source: fengyuanchen/cropper

Hello @fengyuanchen ,
Thanks for cropper script. Really helpful one.

I have an annoying issue with the cropper inside modal.

The modal show event is triggered on input upload form. So if I select a file from PC a modal shows up. The issue is that the preview doesn't fit the modal box. The image/cropper is to small.

modal_cropper_small

On the other hadn if I change the browser size it automatically fit the modal.

modal_cropper_fit

I tried the stuff from https://github.com/fengyuanchen/cropper/issues/85 but don't understand where the data: originData comes from. Even using the example from https://github.com/fengyuanchen/cropper/blob/master/examples/cropper-in-modal.html doesn't work.

Would really appreciate your help.

Source

hpolonkoev

Most helpful comment

You must initialize the cropper only when the modal has been shown completely!!!!!!!!!!!!!!!!!!!!!!!!

fengyuanchen on 30 Oct 2016

👍2 👎1

All 5 comments

You must initialize the cropper only when the modal has been shown completely!!!!!!!!!!!!!!!!!!!!!!!!

fengyuanchen on 30 Oct 2016

👍2 👎1

@fengyuanchen Thanks a lot. This actually helped.

hpolonkoev on 2 Nov 2016

cant u please show me our solution?, I have the same issue

MironD on 25 Jan 2018

@MironD sorry mate.
It has been a year and a half since I worked on the project. Don't have the code and I am not working for this client/company anymore.
Maybe you could create a new issue and post you code.

hpolonkoev on 25 Jan 2018

You just set "backdrop: false" in bootstrap modal and work find :)