search

advanced-cropper / vue-advanced-cropper

The advanced vue cropper library that gives you opportunity to create your own croppers suited for any website design
https://advanced-cropper.github.io/vue-advanced-cropper/
Other
931 stars 130 forks source link

Cropper does not show in Modal until window is resized #182

Closed ataldev closed 2 years ago

ataldev commented 2 years ago

I am using bootstrap modals. When I refresh the page and open the modal the copper doesn't show. But when I resize the window in some way; like resizing the inspect element window or maximizing chrome, the cropper then shows up. If I close the modal then and reopen, the cropper will show.

vue-advanced-croper-modal

Here is the sandbox for it: https://codesandbox.io/s/morning-night-9nl2v9?file=/src/components/HelloWorld.vue

Norserium commented 2 years ago

@depressedpsychiatrist, hello!

  1. When the external container has display:none the cropper can't set own size properly.
  2. When you resize the window, it calls cropper.refresh method internally, it recalculates the size of cropper.

You can call this method on your own when modal is opened (i.e. the container is visible). The example.

ataldev commented 2 years ago

Thanks for the quick reply.