Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

iFrame slide content reloads on resize #205

Open
MartinP-C opened this issue Aug 21, 2018 · 5 comments
Open

iFrame slide content reloads on resize #205

MartinP-C opened this issue Aug 21, 2018 · 5 comments

Comments

@MartinP-C
Copy link

MartinP-C commented Aug 21, 2018

Example here: https://codepen.io/Bobsworth/pen/EexJxP

When the page is resized, the iFrame "reloads".
This is undesirable as it will reset the iframe and flash.
In my production usage where I discovered this I have a Siema carousel in the iframe, which itself is slide 2 of a Siema carousel! So if the page is resized the inner carousel will reset to slide 1 when the iframe reloads.

This is from the resizehandler calling buildSliderFrame which recreates the inner elements, creating a new iframe element which loads again, appearing to be refreshing.
I fixed this by not recreating the docFragment on resize (in a new reBuildSliderFrame method).

I can create a pull request later.

@pawelgrzybek
Copy link
Owner

Hi.

No, PR is not needed. I will address this issue in a next version. Thanks for reporting an issue.

Have a great day 👋

@raphiz
Copy link

raphiz commented Aug 28, 2018

Hi.

I think I have the same issue. When embedding YouTube videos, clicking on the full-screen icon triggers a reload of the iframe, which (of course) closes the full-screen of the previous iframe immediately.
I guess that's because a window resize event is fired, but I'm not 100% sure.

Anything I can do to fix this as soon as possible?

@dmytrodemchenko
Copy link

Hi @pawelgrzybek,
Do you have some estimates for the current task - when will it be fixed?

We don't want to switch to another plugin, but the current fix is necessarily required in nearest time for avoiding our transition.

Thanks in advance!

@nielsodgaard
Copy link

Does anyone know a workaround for this issue?

@qubaji
Copy link

qubaji commented Dec 30, 2020

I did something like this to work around the issue:

let wasFullscreen = false;
window.removeEventListener('resize', carousel.resizeHandler);
window.addEventListener('resize', function() {
  const isFullscreen = window.screenTop === 0 && window.screenY === 0;
  if (isFullscreen) {
    wasFullscreen = true;
  } else if (wasFullscreen) {
    wasFullscreen = false;
  } else {
    carousel.resizeHandler();
  }
});

Sure there's improvements to be made but seems to do the trick as far as I can see.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

6 participants