Jump to content
GreenSock

SteveZ

Members
  • Posts

    9
  • Joined

  • Last visited

SteveZ's Achievements

Newbie

Newbie (1/14)

0

Reputation

  1. SteveZ

    Draggable Opacity

    Hello, I have a draggable object (Note_G2) that I created. I'm using Adobe Edge and want to know if there is a way to change the object's opacity when it is dragged to a particular position. I don't want the opacity to change while dragging, only once the object has reached a certain position ( i.e.: once it reached its bounds) in which I'd like its opacity to be about 25%. Here is my current draggable which works great. Is there a simple variable to include that will help me achieve this? Draggable.create(sym.$('Note_G2'), { bounds: sym.$("Rectangle"), type: "x", cursor: "ew-resize", edgeResistance: 1, zIndexBoost: true } ); Thanks! SteveZ
  2. Hello, I'm making an interactive analog clock using Adobe Edge. The hands of the clock can be dragged to any particular time. When dragged, the movement of the hands coincide with each other. I was able to code the "hour" hand that when dragged the "minute" hand moves accordingly (with 12 times the rotation). It works flawlessly. var hourHand = sym.$('Clock_H'); var minHand = sym.$('Clock_M'); Draggable.create(hourHand, { type:"rotation", throwProps:true, onDrag: syncMinHand, onThrowUpdate: syncMinHand } ) var hourDraggable = Draggable.get(hourHand); function syncMinHand() { TweenLite.set(minHand, {rotation:hourDraggable.rotation * 12}); } However, I want to be able to accomplish the same for the "minute" hand. When the "minute" hand is dragged the "hour" hand moves accordingly (12 times slower). I want to be able to independently move either hand at any point with the other hand corresponding appropriately. Any help is greatly appreciated!
  3. SteveZ

    Infinite Draggable

    Thanks Rodrigo, you've given me a lot to go on! ~Steve
  4. SteveZ

    Infinite Draggable

    Thanks Jack, I'll give it a go!
  5. SteveZ

    Infinite Draggable

    Is it possible to create an infinite draggable loop using GSAP Draggable coupled with TweenMax? I'm creating an animation demonstrating a briefcase combination lock - the kind with three or four inline tumblers next to each latch on a briefcase that are rotated to form a combination. Only one number (an image-not text) appears on the face of the tumbler I made. Draggable works great when I move ("rotate") the tumblers to reveal the next successive number; but my image is a png file that is a vertical line of numbers from 0 thru 9. I would like the numbers to repeat or loop if I was to continue dragging the tumbler giving the impression that it loops around.
  6. I have another question regarding the same Edge animation, how can I constrain the dragging of the letter 'A' within a rectangle (aptly named "Rectangle")? The following code doesn't seem to work: Draggable.create(sym.$('AA2'), {bounds: sym.$('Rectangle')} );
  7. Carl, Works like a charm! Thanks! Being a newbie can be frustrating.
  8. Hello, I'm making the transition from Flash to Edge animate. I have a simple object (the letter 'A' named AA2) that sits on the stage. I have it animate by moving from one side of the stage to the other. After the animation is complete, I then want to be able to drag the letter anywhere on the stage. The dragging works fine with jQuery draggable, however I cannot seem to apply the same functionality using GreenSock's Draggable function. I would really like to use GSAP but I'm having trouble. I attached a zip of the Adobe Edge Animate file in question. If you don't have Animate, I included the code that is attached to the creationComplete of my Stage. Any help would be greatly appreciated! yepnope({nope:['js/jquery-ui-1.10.0.custom.min.js', 'js/Draggable.min.js', 'js/TweenMax.min.js'], complete: init}); function init(){ sym.$('AA2').draggable(); //Want to do the same except use GreenSock's Draggable instead of jQuery but not working //sym.$('AA2').Draggable.create(); } Thanks. Testy.zip
×