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

What is Framer? Join the Community
Return to index
Kevin Cannon
Posted Nov 05 - Read on Facebook

Hey all - I'm noticing that contentScale seems to have a strange affect on draggable objects. They don't stick to teh mouse like they should. It only wokrs right if contentScale is set to 1. That kinda makes the feature not usable. Any suggestions or workarounds?

5 Comments

Benjamin Den Boer

Hey Kevin, could you attach an example of this? I couldn't replicate the issue.

Kevin Cannon

Hey Benjamin - Thanks for the reply. I tried my files again this morning, after the weekend, and having no problems with it now. Very strange. I don't know why. I'll let you know if I can reproduce it again.

Kevin Cannon

Back again - not getting the same problem, but it's related. I'm trying to make a menu appear when the mouse or finger are on screen, which adjusts when the user moves.

I've got the very basic test here. On device it works fine, on my computer, the tracking isn't right. The red box moves with a sort of parrallax effect, isntead of moving exactly with the blue box.

Is this me misunderstanding touch events, or a bug?

https://dl.dropboxusercontent.com/u/89613/Prototypes/FramerJS/drag_event.framer/index.html
https://dl.dropboxusercontent.com/u/89613/Prototypes/FramerJS/drag_event.framer.zip

Benjamin Den Boer

Hey Kevin,

Thanks for the example! Ah, I see. Well, you're offsetting the X & Y positions of layerB when defining the layer. So the new X and Y positions of layerB include this offset.

Working with "print" often helps here (here's the output after a bit of dragging)
layerB.x = 418
myLayer.x = 542
clientX = 418

What you could do is match the X & Y of the layers within the Drag event, including the offset:

myLayer.on Events.DragMove, ->
layerb.x = myLayer.x + 30
layerb.y = myLayer.y + 30

(30 being your offset)

Kevin Cannon

Hey Benjamin - Thanks. That sort of works, but the problem is still that I need to know where the user has clicked or tapped. That's why I used "touchEvent.clientX", but it's causing the Parallax effect, even if I get rid of the offset. It only happens in the frame.

With 'fullscreen' it's not happening, only when previewing in a device frame. I think something odd is happening with the touchEvent co-ordinates, that they are using a different co-ordinate system.

Mini example updated:
https://dl.dropboxusercontent.com/u/89613/Prototypes/FramerJS/drag_event.framer/index.html
https://dl.dropboxusercontent.com/u/89613/Prototypes/FramerJS/drag_event.framer.zip

Read the entire post on Facebook