Unable to drag inside an iframe

[giorgiof2]

Hi, i am unable to drag the crop inside the iframe, seems that can't receive the event drag,

here there is the sandbox with the problem.
https://codesandbox.io/s/react-image-crop-demo-with-react-hooks-forked-w9fpb?file=/src/App.js

[dominictobias]

Hey, you need to load the CSS in your iframe, I'm not exactly sure of the best way to do that it will depend on your setup. In that sandbox you could copy ReactCrop.css into public/ for example and then load it in the head of the iframe.

[giorgiof2]

I added the css too now. I think that the problem is that the events aren't on the document of the new iframe but on the old one it might need a pull request to change this.

[ebukaodini]

Hi, I had similar issue with cropping the image on bootstrap modal.
It failed to indicate the drag on the modal, but when I try it on a normal page, it works.
The crop is updated on drag but doesn't show the drag handle or the crop selection.
Is there any fix for this yet?

[dominictobias]

Hi, I had similar issue with cropping the image on bootstrap modal. It failed to indicate the drag on the modal, but when I try it on a normal page, it works. The crop is updated on drag but doesn't show the drag handle or the crop selection. Is there any fix for this yet?

If you can provide a repo or codesandbox with the issue I will take a look

[ebukaodini]

Hi Dominic, thanks for responding.
So yesterday I was able to fix it.

The issue was the modal wasn't getting the state from the page 🤦‍♂️

I resolved it by making the modal into a completely different react component with its own state.

Thanks

[dominictobias]

Hi Dominic, thanks for responding. So yesterday I was able to fix it.

The issue was the modal wasn't getting the state from the page 🤦‍♂️

I resolved it by making the modal into a completely different react component with its own state.

Thanks

Ah cool 👍