Jump to content

Search the Community

Showing results for tags 'modifersplugin'.

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


  • GreenSock Forums
    • GSAP
    • Banner Animation
    • Jobs & Freelance
  • Flash / ActionScript Archive
    • GSAP (Flash)
    • Loading (Flash)
    • TransformManager (Flash)

Product Groups

  • Club GreenSock
  • TransformManager
  • Supercharge


There are no results to display.

Find results in...

Find results that contain...

Date Created

  • Start


Last Updated

  • Start


Filter by number of...


  • Start



Personal Website



Company Website



Found 3 results

  1. Hi, I have some elements undergoing a z axis transform but I need them to maintain their own perspective (using the perspective function on the transform as opposed to using the perspective property of their parent element). When I perform a vanilla z axis animation GSAP will add something like the following style tag: style="transform: translate3d(0px, 0px, 200px)" I was thinking maybe there might be something I could do with the modifier plugin but this seems to allow modifying values before they are concatenated into a templated style update. Does anyone know how I could include a perspective function in the transform. e.g. style="transform: perspective(90px) translate3d(0px, 0px, 200px)" The Mozilla docs use a perspective function in their translate3d reference so it should be valid. I'm just not sure how I can get GSAP to include this modifier. Any thoughts good people of the Greensocks forum?
  2. Hi Everyone, I've been trying to recreate one of the infinite Draggable carousel that I've seen in this forum Any idea of what I'm missing? Thank you in advance
  3. I've been noticing lately that it would be very handy if there was a way to wrap values during a tween, just like the hours on a clock. 9 + 4 hours = 1. I made a demo that does this for positioning, but it's not very performant because it creates a lot of tweens on every update. http://codepen.io/osublake/pen/4d1b3311b08073d0bebfa061a2199e61?editors=0010 Creating something like that could be greatly simplified if there was a way for GSAP to do that internally. A modulo operator has been proposed for a future version of ECMAScript using this syntax. -2 mod 12 So we could use the word "mod" to tell GSAP to run the value through a modulo function before applying the value. TweenLite.to(foo, 1, { x: "800mod600" }); So what's going to happen is that it will tween to 600, go back to 0, and tween to 200. This would make creating carousels/sliders a breeze. var index = 0; $("#prev").click(function() { move(-1); }) $("#next").click(function() { move(1); }) function move(steps) { index += steps; TweenLite.to(".slider", 1, { xPercent: index + "00mod500" }); } Pretty simple! No cloning, calculating positions, or secondary updates required. And because it's position will automatically reset, you can click through the slides as fast you want. The only problem I see with the mod is that it resets the value to 0. This is probably not something you want to happen for something like scaling, so there should be a way to define a base value. Maybe something like this. TweenLite.to(foo, 1, { scale: "2mod0.5+=1" }); Thoughts?