kidaww
Content Type
Profiles
Forums
Store
Blog
Product
Showcase
FAQ
Downloads
Posts posted by kidaww
-
-
21 hours ago, ZachSaucier said:
Thanks for clarifying. I see what you mean. If you go into "Toggle Device Toolbar" mode and try to scroll the polygons in the vertical direction they don't move very far.
However, on an actual mobile touch device I don't see the same behavior. Maybe it's an error with Chrome's dev tools?
i tried it on touch panel today. Still doesnt start moving on Y axis.
If i remove type: 'x' on rectangle draggable it works fine, but i need this type x) -
16 minutes ago, ZachSaucier said:
Hey kidaww and welcome to the GreenSock forums.
I put your code into a CodePen and wasn't able to reproduce the error that you're speaking of. Evidently there's something else going on.
See the Pen
See the Pen OJJyRWQ?editors=1000 by GreenSock (@GreenSock) on CodePen
by GreenSock (@GreenSock) on CodePenCan you please create a minimal demo of your issue inside of a CodePen? You can for the pen above if you'd like.
Hi! Thx you for codepen example, i worked with 'touch' draggable with Chrome Devtools 'Toggle Device Toolbar'. With mouse all works fine..
-
Draggable.create(".poly", { bounds:"svg", onDragEnd(e) { //... } }); Draggable.create('.rect', { type: 'x', onDrag(e) { //... }, onDragEnd(e) { //... } })
<svg width="1920px" height="1080px" class="assemble__svg"> <defs> <pattern id="img1" patternUnits="userSpaceOnUse" width="2771" height="520"> <image preserveAspectRatio="none" xlink:href="../assets/linen.png" x="0" y="0" width="2771" height="520" /> </pattern> </defs> <polygon class="rect" ref="drag" id="rect" index="0" points="-2300 562, 471 562, 471 1002, -2300 1002" fill="url(#img1)"/> <g class="poly-group" :class="{ active: stages.second }"> <polygon class="poly" :class="{ active: isValid(1) }" id="poly-1" index="1" points="200,10 250,190 160,210" style="fill:lime;stroke:purple;stroke-width:1" /> <polygon class="poly" :class="{ active: isValid(2) }" id="poly-2" index="2" points="320,110 400,310 270,350 223,334" style="fill:lime;stroke:purple;stroke-width:1" /> </g> <image xlink:href="../assets/fake_wood.png" x="0" y="500" height="566" width="122" /> <image xlink:href="../assets/linen-box.png" x="50" y="515" height="533" width="256" /> </svg>
All my '.poly' elements cant move vertically, until i move it horizontally... What's wrong?
Draggable 'type' applies to all instances
in GSAP
Posted
Thank you so much!!!)