[Can't get updateTo to work properly]

Thank you, Sahil!

 

That's exactly what I need. Thanks a bunch for the thorough explanation!

 

Cheers

[Can't get updateTo to work properly]

Hi Sahil,

 

Here is a test case.. So the yoyo effect is working, but as you can see it's going outside the screen to the left despite me trying to use updateTo to change the X value so it won't.

 

See the Pen VxVNJJ by grpk92jdiu2i (@grpk92jdiu2i) on CodePen

 

[Can't get updateTo to work properly]

Hi guys,

 

First of all, thank you GreenSock team for creating this amazing product. It has made me excited about web development again! And I'm now on the quest to create my first game using GreenSock.

 

First post here, although I've been reading quite a lot on the forums for the last couple of days - thanks all for the help I've found in the different threads!

 

Now to my problem...

 

I've got the an object that I want to tween from left to right, right to left infinitely. I got that working.

 

My problem is that my object is set to -150px to the left of the screen via CSS. I then tween the x value to go all the way to the right, then a repeat set to -1 and yoyo set to true. So it's going back and forth as I want.

 

BUT...

 

After the first tween, when it's all the way to the right, I need to update the from-X tween value to 150 so my element doesn't go outside the screen.

 

I just can't get that working properly, I bet I'm missing something trivial, or misunderstand how updateTo() should be used...

 

It does run the updatex() function but it breaks the yoyo effect and doesn't seem to change the X value as intended.

 

Here's the code:

 

.submarine {
  background: #707070;
  width: 150px;
  height: 50px;
  border-radius: 20px;
  position: absolute;
  bottom: 50px;
  left: 100px;
  z-index: 1;
}

 

my_submarine = $('.submarine');

submarine_tween = new TweenMax.fromTo(my_submarine, 2, {x: 0}, {onRepeat: updatex, x: window_width, repeat: -1, repeatDelay: 2, yoyo: true});


function updatex() {
  
	console.log('updating values');
  
	submarine_tween.updateTo( {x: 150}, {x: window_width}, false );
}

 

 

Thanks in advance

 

awikio