Magnific-popup: Youtube video jerk/shaking in Iframe popup

[sainikumar]

Youtube video is jerking/shaking in iframe popup. See the video example in at

http://dimsemenov.com/plugins/magnific-popup/

Click on "Open Youtube Video" link on this page.

[crushingpixels]

I am having the same exact issue. It is happening in Chrome. Not in Firefox.

[nourseofcourse]

We are having the same issue on Mac -> chrome on all of our sites.

[squire2k]

I think i've solved this - by commenting out this line in the css, looks like it's something to do with the way Chrome is handling the drop shadow...

box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);

[sainikumar]

Thanks a lot. It's working.

On Fri, May 4, 2018, 1:59 PM squire2k [e-mail] wrote:

I think i've solved this - by commenting out this line in the css, looks
like it's something to do with the way Chrome is handling the drop shadow...

box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);

—
You are receiving this because you authored the thread.
Reply to this email directly, view it on GitHub
https://github.com/dimsemenov/Magnific-Popup/issues/1062#issuecomment-386536450,
or mute the thread
https://github.com/notifications/unsubscribe-auth/AVnVcAy_Xbu1Qz3WV727COgXph6Qdygsks5tvBFcgaJpZM4Tvpwy
.

[liquidvisual]

Can confirm it's a Chrome issue, I first noticed it when Chrome updated (roughly 2 weeks ago from today) and my other computer was a version behind with no issues.

Thanks @squire2k for saving me a tonne of work!

[kapoko]

Can confirm this works. If you happen to use the scss file you can also override the default value of the following variable before you import it:

$mfp-shadow: none;

[glowform]

Anything that expands the iframe element like drop shadow, border or padding will cause shaking.

[hokoo]

I renewed Chrome to version 67.0.3396.79 64bit, the problem was disappeared

[faradaytrs]

In chrome problem is solved but still exists in stable opera

[rdhelms]

In case this helps anyone else...

For us the issue was seemingly that we had an iframe with width 100%, a small border, and box-sizing: border-box. For some reason the calculation of this iframe's width on Chrome and Opera caused the whole iframe to shake strangely (and only on some machines, despite running the same OS and version of Chrome).

We were able to fix it by any of the following:
a) Change width (<100% or >101% both worked)
b) Remove border
c) Change to box-sizing: content-box

Very strange issue.