Jump to content
GreenSock

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

mathias5

Members
  • Content Count

    13
  • Joined

  • Last visited

Community Reputation

0 Newbie

About mathias5

  • Rank
    Member
  1. Hi, i have this horizontal list of images stored in a container mc. The container is masked and i want to animate the container when clicking on next/prev buttons. the container should then slide so a new image gets visible. I ll try to explain it a bit better. the container is a movie clip with a dynamic with. the mask has a fixed with (so correct amount of images get shown). all images are aligned horizontal. now i want to animate the container on click left/prev so the images thats visible changes. Here is the positioning of the images. I don't know how to get the sliding work.
  2. mathias5

    z-sorting

    Hi, trying to get this z-sorting to work proper. What i want to achieve is some kind of looping/carousel. When a ".area" is getting clicked it should be placed at the very bottom z-wize. And when all elements have been set to bottom they should start to be placed up again. Really like an carousel but z-wise. Any ideas? fiddle: http://jsfiddle.net/EjpSu/8/
  3. mathias5

    Change element

    Hi, Rodrigo's last answer did the job! Thank you guys!
  4. mathias5

    Change element

    Hi, thank you! I have tested your code now. When i now start to drag one card i get this error: ReferenceError: $this is not defined. Its on line 38 in your code, the if statements. Any idea? if(TweenMax.isTweening($this))
  5. mathias5

    Change element

    Hi, I've tried to make it a loop instead but it did not work. The problem was the same. I can't put the tweens in the draggable callback since i do -=180 and +=180 in the tweens which will make the element to move continuously. Hm,to create a function and pass target and rotation sound like the way to go maybe. How would i do that?
  6. mathias5

    Change element

    Hi, Thanks! Here is an updated example with 3 cards. Now you can more see what the problem is. When dragging a card and the flip-tween runs it flips all cards. Its suppose to only flip the current. http://jsfiddle.net/AFU3T/11/
  7. mathias5

    Change element

    Here is a fiddle. What i need help with is so i can run the tweens multiple elements of the class. Lets say I'm looping out 20 cards. Then i want the tweens to be applied individually. http://jsfiddle.net/nPM5V/
  8. mathias5

    Change element

    Hi, thanks for your answer. The thing is that i can't pass THIS. thats because i run the tweens in a jquery draggable and the tweens is declared outside of that scope. I can try to put it on a fiddle.
  9. mathias5

    Change element

    In an init() function i declare these two tweens. var tweenLeft = new TweenLite.to($(".card"), 0.6, { rotationY: '+='+rotVal, transformStyle:"preserve-3d",ease:Back.easeOut,perspectiveOrigin:'50% 50% 0px', paused:true, perspective:1000}); var tweenRight = new TweenLite.to($(".card"), 0.6, { rotationY: '-='+rotVal, transformStyle:"preserve-3d",ease:Back.easeOut,perspectiveOrigin:'50% 50% 0px', paused:true,perspective:1000}); Later on in a drag() function i run this to start the tweens: tweenRight.restart(); tweenLeft.restart(); When i start to drag the ".card" all of them gets t
  10. Hi! Created a little jsfiddle. Dit not get the actual dragging to work in there, never using it before. But hopefully you get the idea on the code. http://jsfiddle.net/9jHMX/
  11. Wow, thanks guys! I have been looking at all suggestions and implemented it. It almost works now. I run this on a query draggable event which makes it an infinite tween. How can i pause/stop the tween after every step/180 and then continue on next drag? mean so its not continuously spinning. This is what i run in my drag. var tweenLeft = new TweenLite.to($(el), 1, { rotationY: '+=180', transformStyle:"preserve-3d",ease:Back.easeOut,perspectiveOrigin:'50% 50% 0px', paused:true}); var tweenRight = new TweenLite.to($(el), 1, { rotationY: '-=180', transformStyle:"preserve-3d",ease:Back.e
  12. Hi and thank you! I'm actually using your code pen as a reerence for my stuff. I only changed some things. I think i made the description of my problem a bit too complicated. What i need is this: When you have flipped the card and its on -180 i want to be able the control in what direction it should flip back. Almost like a toggle. Now i flip it to -360 when flipping it back. That looks nice. But when i then try to flip it over ageing to its initial (-180) it all gets buggy. Some how i need the flipping-value to be dynamic. As an example. Your code pen always flips in th
  13. having some trouble with an tweenlite animation in query. I want to switch the animation direction depending on a variable. I have a variable that represents "left" or "right". those values is set when the user drags the mouse in that direction. And i need to change my animation so it animates in the right direction depending on this variable. The animation basically flips a div. Like a card flip. Need the get the rotation value somehow dynamic. Anyone having an idea? CODE var tb = false; if (dirX == "right") { if (tb == false) { TweenLite.to($(this).find(".obj"), 1, {
×