search

dimsemenov / Magnific-Popup

Light and responsive lightbox script with focus on performance.
http://dimsemenov.com/plugins/magnific-popup/
MIT License
11.38k stars 3.49k forks source link

Youtube video jerk/shaking in Iframe popup #1062

Open sainikumar opened 6 years ago

sainikumar commented 6 years ago

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 commented 6 years ago

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

nourseofcourse commented 6 years ago

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

squire2k commented 6 years ago

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 commented 6 years ago

Thanks a lot. It's working.

On Fri, May 4, 2018, 1:59 PM squire2k notifications@github.com 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 commented 6 years ago

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 commented 6 years ago

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 commented 6 years ago

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

hokoo commented 6 years ago

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

faradaytrs commented 6 years ago

In chrome problem is solved but still exists in stable opera

rdhelms commented 5 years ago

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.