This is a read-only archive of the Framer Community on Facebook.

What is Framer? Join the Community
Return to index
Daniel Lin
Posted Sep 15 - Read on Facebook

Hi, I'm learning by playing around with the 3D card stack UI (inspired by Ed Chao) and ran into a problem.

On my extended monitor, the Mirror browser preview works perfectly fine, but it goes crazy when I move it to my laptop (mbp 13" retina) monitor, as shown in the video.

Can anyone help me understand why this happens? Thanks in advance...


Johannes Eckert

It should be fine after you reload, right? I guess this has something to do with changing the resolution in the same window instance, which is always a challenge

Daniel Lin

Thanks for the suggestion. However the same thing happens no matter which resolution I refresh the window in. After it starts going crazy, I could even drag it to back to the extended monitor (without a refresh) and it would start working again after a few clicks. Weird!

Jonathon Toon

Could you try something in CoffeeScript where you detect the browser resizing, or if the screen is retina, and then reload the script? I know this can partly be done in regular JS.

Ed Chao

Hey Daniel, havent gotten a chance to look into this but if you are using any window properties like innerwidth or innerheight these might cause issues. My guess is that the viewport size change is causing strange behaviors.

Koen Bok

Let me know if you guys find out exactly what this is and I can maybe add a fix in the core. It _might_ also have to do with requestAnimationFrame

Ed Chao

Daniel Lin could you share your code please. I'm not having this problem with my own project.

Anders Hedwig

This happens on every Window.resize but reload fixed it for me so far.

Daniel Lin

Jonathon, Ed, Koen, thanks for the help. I won't get a chance to play with it again until later tonight but I'll try those!

Ed, sure thing, I put it up here:
(sorry for any poor code quality/readability..)

Read the entire post on Facebook