Prevent scrolling in embeded Miro board

  • 20 December 2021
  • 4 replies
  • 360 views

Hi everybody,

 

I am currently working on a web based prototype that integrates different areas of a Miro board via iframes. I currently face the following challenge:

When you load a web page that integrates a part of a Miro board via iframe and scroll down the page, the mouse gets capture in the iframe and you continue scrolling within the Miro board. So you happen to have a completely different area of the board visible in the iframe.

Any chance to prevent this? So ideally kind of fixing the area of the board that is visible in the iframe?

As a workaround I put a button below the iframes that simply reloads the iframe and thereby “centers” the view again. But that’s not very usery friendly.

 

Thanks for helping!


4 replies

Userlevel 2
Badge

Hey @Manuel Hess! Thanks for your question!

What you’re describing is actually intended behavior for Live Embed. An embedded Miro board is meant to behave as a fully-functioning Miro board, placed inside of a webpage. In this case, when the iFrame has the cursor focus, the board will zoom/navigate according to the cursor actions. When the webpage has the cursor focus, the webpage will scroll as expected.

I’d like to understand more about your use case. Are you wanting users to have more context before interacting with the Miro board? Or are you wanting the board to remain unchanged?

 

Thanks!

Joanna

Hey @Joanna Smith, thanks for asking. 
 

This is the use case:

We are currently building a web-based Hi-Fi prototype for a future application. So on the websites the user gets a lot of content (text, videos, graphics etc.). Based on this content the user needs to provide input: move elements around, enter text etc. For capturing the input we want to use an embedded Miro Board. Doing everything in Miro is not an option. 
For every input we want to capture we have designed a different area in one big Miro board.

So in a specific part of the application the user is supposed to interact only with one area of the board (and make changes).

The challenge is now that it can happen very easily that you move around in the board unintentionally. 
This could be fixed for our use case if it would be possible to fix the area of the board that is visible in the iFrame.

Hope that clarifies a bit what we are trying to do.

I am aware that this is most probably not the use case this feature was built for ;-)

Thanks for helping!

Hi, 

This is definitely also a feature that would be useful for me. In particular I want to be able to embed part of a board into a sharepoint site but not have the rest of the board visible to those users accessing it via the sharepoint - it contains information they either don’t need or that would be distracting. being able to lock the embed area would mean we don’t have to move the bit we’re embedding to an entirely different board.

Badge

I second this. Take Notion embeds for example. For documentation, I add a Miro board into a document. But as user scrolls on notion, the miro embeds start scrolling within if mouse is simply over the miro embed. This happens particularly for any users who visit the notion page. The position of the scroll is also saved, so next user coming to website will see something else within the embed. Within that small space, it is very easy to lose the position.

I wish the board links would allow an option such as “&lock=true” in the URL, so that the embed can not be scrolled within. 

Reply