Jump to content
GreenSock

Search In
  • More options...
Find results that contain...
Find results in...
joycedijkgraaf

Can someone help me to get the draggable spin to work with Adobe Edge?

Recommended Posts

Hi there,

First of all, I love the things you guys make possible. 
The draggable spin was exactly what I was looking for. Unfortunately I am a complete noob with javascript or any coding whatsoever. 

I tried to make it work for the last couple of hours, but the fact is. It is not my cup of tea. But I am willing to learn. 
Could someone help me by explaining step by step, in a very childish way, what I need to do to make an object spinnable in Adobe Edge with Greensock?

What I did so far:

Put this in the html:

<!--Adobe Edge Runtime End-->
 
<script type="text/javascript" src="edge_includes/js/ThrowPropsPlugin.js"></script>
<script type="text/javascript" src="edge_includes/js/TweenMax.js"></script>
<script type="text/javascript" src="edge_includes/js/Draggable.js"></script>

Converted the images in Adobe Edge to symbols. And used this code on the symbol in actions click in en replacing ("#knob" with ("#nameofobject")

Draggable.create("#knob", {type: "rotation", throwProps: true});

And now I am lost. 

Could someone help this designer lady into the language of scripting. It would probably make my life a lot easier ;-)
Link to comment
Share on other sites

Hi joycedijkgraaf  :)

 

pls follow these steps :

 

1 - remove script tags from html header add from adobe Edge Library scripts tag 

 

2 - put your draggable create code in Stage compositionReady scope 

 

3 - pls change your selector to this : "#Stage_knob"

  • Like 1
Link to comment
Share on other sites

Hi Joyce,

 

I don't use Edge Animate much, but Diaco and some other power users around here do. I think the best thing for you to do is create an Edge project that only includes the knob, zip up all your files (excluding the GreenSock library) and post them here. Probably easier for someone just to fix what you have and then explain what they changed.

Link to comment
Share on other sites

Thx for you reply Carl. I attached the project file and you will be my long time hero if you know how to make it work and explain it to me. 

 

 

 

 

 

 

 

 

 

[edit: files removed that included bonus plugins]

Link to comment
Share on other sites

hmm, it appears you did not attach anything. If you are having problems feel free to post it on a free file sharing service like http://ge.tt/(no emails, no membership, super easy).

Link to comment
Share on other sites

It works!! Awesome! Thanks Diaco!
I see that I did not needed ThrowProbsPlugin after all?
And I did not need to convert the images to symbols?
Was that what i did wrong?

Link to comment
Share on other sites

Of course , you can add ThrowPropsPlugin.js , and set throwProps:true in your draggable create .

in edge animate your image contained in a div , so you can make that draggable without converting to a symbol . but keep in mind that you can even make an img tag draggable by GSAP :)

Link to comment
Share on other sites

Just added the ThrowPropsPlugin and it works great! Thank a lot! I have been trying to make it work for two days :-P
But what did I do wrong?

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.
×