Scroll is not working over the Iframe with embedded flutter application

Question

I have a flutter application which I deployed on a server. On a webpage, I embedded the flutter application Inside an Iframe.

Problem

When I scroll the page, After reaching the iframe, I cannot scroll any more. It seems Flutter application consumes scroll events and do not pass the events to the web page. And I need user interaction with the iframe as well. I have multiple widget like carousel, Poll slide, Horizontal scrolling and vertical scrolling inside the iframe. I have implemented one of my widget with jquery (not flutter) and it worked perfectly. I researched more than 2 months about this issue, I found the work around for desktop : s.addEventListener.apply(s,["wheel",q,r]) If I remove this line from main.dart.js, The scroll behavior fixes in desktop browsers But I still have problem in mobile browsers such as Safari.

Thank you in advance.

Papillon

I am facing the same issue. Have you found a fix or workaround? – Maculation

Unfortunately no. If you remove this line from main.dart.js : s.addEventListener.apply(s,["wheel",q,r]) then you can scroll over the iframe with mouse's wheel. and for mobile devices you can change this line in main.dart.js : touch-action: j, to touch-action: 'pan-y' Then you can scroll with touch, but if you have any vertical scroll in your page, It won't work. – Papillon

Answer 1

Try wrapping the widget with Flexible()

Upsydaisy

Your answer could be improved with additional supporting information. Please edit to add further details, such as citations or documentation, so that others can confirm that your answer is correct. You can find more information on how to write good answers in the help center. – Mirabel

Answer 2

be sure that your 'scrolling' takes 'yes'.

Levirate