Jump to content
Search Community

soubkia

Members
  • Posts

    4
  • Joined

  • Last visited

soubkia's Achievements

0

Reputation

  1. Thanks for the reply! I have updated the pen. The flickering is now fixed however I am still having issues with onRelease. I will try to explain it more carefully. If you pull a card, then release the mouse click without moving the mouse the hover() animations will still be in effect and the mouseout() animations will not trigger until the mouse moves. I believe draggable is not updating the cards current location until after the mouse moves. To fix this I found the update() function and attempted to tie it to the tweens onUpdate parameter. However when I tried to do this it was not very pleased. It appears that update() is not being recognized as a function but I don't really believe that error. I must be making some sort of javascript mistake. TweenMax.to(this.target, 0.5, {x: 0, y: 0, ease: Expo.easeOut, onUpdate: this.update()}); I have updated my versions of TweenMax and Draggable in this codepen. http://codepen.io/AdilSoubki/pen/yyGaOv EDIT: Please let me know if my issue with onRelease is unclear. If so I will make a separate pen to demonstrate the issue in an isolated environment.
  2. Replaced .front { @if ($debug) { border: solid 1px green; } @include transform(rotateY(0deg)); } .back { @if ($debug) { border: solid 1px orange; } @include transform(rotateY(180deg)); } with TweenMax.to($('.front'), 0, {rotationY: 0}); TweenMax.to($('.back'), 0, {rotationY: 180}); and that seemed to have fixed the flickering. Still don't know whats up with onRelease.
  3. I just started using these libraries today but I hit a bit of a roadblock. I am aware that my pen is awkwardly mixing css transforms and greensock tweens however even when all css transforms are commented this problem persists. The content on the back of the card flickers when rotating to match its fanning angle during the animation. The center one, which has no rotation, does not flicker at all. However the others do. Also strange is that the front of the card does not experience this at all. Additionally I noticed that onRelease does not seem to move the object back to the original location until after a mouse move event has occured. this means my mouseout animations will not trigger if you drag the card and then do not move the mouse. Any ideas on work arounds to these problems? The red line is just the area where the drag event should be forced to end and the blue line is the hand area. I sorry for the messy scss, I was trying to move over to greensock however now that this is broken Im not sure what to do. http://codepen.io/AdilSoubki/pen/dPwPRP
×
×
  • Create New...