Jump to content
GreenSock

kathryn.crawford

Repeating flicker

Go to solution Solved by PointC,

Warning: Please note

This thread was started before GSAP 3 was released. Some information, especially the syntax, may be out of date for GSAP 3. Please see the GSAP 3 migration guide and release notes for more information about how to update the code to GSAP 3's syntax. 

Recommended Posts

I'm trying to create a flicker effect (eventually intended for some christmas light images) that will flicker the light off and on on repeat, and with a yoyo effect so there isn't a jump between opacity:1 and opacity:0 when the tween repeats. Right now, nothing is happening in my codepen and I'm not really sure where I went wrong!

See the Pen EVMMjM by kathryncrawford (@kathryncrawford) on CodePen

Link to comment
Share on other sites

  • Solution

switch this:

TimelineMax.to("#flicker", 2, {opacity: 0, ease:RoughEase.ease.config({strength: 0.3, points: 8, randomize: false}), repeat: -1, yoyo: true });

to this:

TweenMax.to("#flicker", 2, {opacity: 0, ease:RoughEase.ease.config({strength: 0.3, points: 8, randomize: false}), repeat: -1, yoyo: true });

and it works :)

  • Like 5
Link to comment
Share on other sites

Related question. If you set a rough ease to repeat, will it randomize each time? If not is there any way to do so? A loop perhaps?

Link to comment
Share on other sites

Hi kathryn.crawford  :)

 

Nope , for randomise tween pls try like this : 

 

var fFire=1 ;

function flicker(){
  if(!fFire)return false;
  TweenMax.to(obj,2,{ ..... ,onComplete:flicker});
};

flicker();

you can stop firing the function by setting fFire to 0 ;

 

See the Pen MaMQry by MAW (@MAW) on CodePen

  • Like 8
Link to comment
Share on other sites

 

Hi kathryn.crawford  :)

 

nope , for randomise tween pls try like this : 

 

var fFire=1 ;

function flicker(){
  if(!fFire)return false;
  TweenMax.to(obj,2,{ ..... ,onComplete:flicker});
};

flicker();

you can stop firing the function by setting fFire to 0 ;

 

See the Pen jbJoOq by MAW (@MAW) on CodePen

 

Ah, I see what you did there. Thanks!

  • Like 1
Link to comment
Share on other sites

with setting the repeat parameter tweens will repeats with exactly same Vars( includes ease ) , so you need to generate new tween again with above or another method .

  • Like 2
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.
×