Jump to content
GreenSock

Diaco

Dragable ScrollLeft proxy issue

Warning: Please note

This thread was started before GSAP 3 was released. Some information, especially the syntax, may be out of date for GSAP 3. Please see the GSAP 3 migration guide and release notes for more information about how to update the code to GSAP 3's syntax. 

Recommended Posts

Hi guys :)

 

i have 2 problem here when use Drag Scroll with $("body") as dragable  :

 

1 - in FireFox and IE that pinned and dosn't drag but work great in chrome and safari !! ...  i think maybe this's a proxy issue !!! what's the solution !?...

 

2 - dragging slowly cause appears heavy distortions on draging !?...

Link to comment
Share on other sites

Do you have a reduced test case to share (like a codepen)? I'd like to see what you mean by "heavy distortions". 

 

I'd strongly recommend not applying it to the <body> but instead just drop your content into a <div> and use that. The <body> is a pretty unique thing that various browsers handle differently. 

 

And you are using the latest version of Draggable/GSAP, right?

Link to comment
Share on other sites

Hi jack :)

 

i`m using Draggable VERSION: 0.10.4

and usually use GSAP with adobe Edge animate . adobe edge create contents in Stage div , so i have only a dive#Stage in html and all of contents created in that . and now for a parallax effect i need to link adobe timeline to gasp timeline and body Scroll with dragging scroll but have this issue ! it seems the scroll proxy avoid to do correct behavior in this case with IE and FF !

 

and for Distortion pls check this out >

See the Pen mLsnl by anon (@anon) on CodePen

 

pls try to dragging very slowly , pixle to pixle , and see what i mean about  Distortion  , pls check that with FF/IE too .

 

thanks in advance

Link to comment
Share on other sites

hmmm... finally i can reduce the distortions with " dragResistance : 0.5 " but now dragging work at half-speed , is there any better solution !?... and still not working with FF / IE ! :(

Link to comment
Share on other sites

Draggable wasn't intended to affect the <body> itself, so my advice would be to simply nest things into a <div> which you could do at runtime dynamically, and then apply the Draggable to that. To add things dynamically, document.createElement("div"), and then loop through the childNodes of <body> and appendChild() them to the new div, and appendChild() that div to the <body>. 

  • Like 1
Link to comment
Share on other sites

Hi Jack :)

 

already i done the same way , but for me it was interesting to know with <body> , anyway thanks for your advice , helpful as always 

 

with best regards  :)

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
×