Jump to content
GreenSock

Barrett

if else Statement

Recommended Posts

Hi All,

 

I'm currently trying to create function that controls a sprite 4420px wide. The sprite is masked and only displays 170px width at any time. On a button click the sprite moves -170px to display the next image and so on. However when the last image of the sprite is reached I want to loop back to the first frame.

 

The if statement only seems to be recognised if the 'style.left ==  0'.

 

Please see my function below any help would be appreciated.

 

Thanks

 

addListeners = function () {
  
  angleLeft.addEventListener('click', angleLeftClick, false)
  
}

leftClick = new TimelineMax({
	delay: 0,
});


function angleLeftClick() {
	
	if (sprite.style.left == -4250) {
		
		leftClick.to(sprite, 0, {
			x: 0,
		})
		
		console.log("clicked");
	}
	
	else {	
		
		leftClick.to(sprite, 0, {
			x: "-=170",
		})
		
	}
}

 

Link to comment
Share on other sites

Tough to see what is happening here with just a few lines of code ... if possible, a CodePen would give us a better opportunity to help. But, I suspect your issue is due to translating the `X` value vs changing the `left` value. The tween is affecting `x`, so the style.left property will remain unchanged. So we have to get its translated value relative to its initial offset.

 

See the Pen ZozxPg by sgorneau (@sgorneau) on CodePen

 

  • Like 6
Link to comment
Share on other sites

Also, just a small additional note, the delay for new timelines is 0 by default so you can just do leftClick = new TimelineMax(); :)

  • Like 2
Link to comment
Share on other sites

Hi Shaun, Acccent,

 

Both of these solutions worked perfectly. Thank you for your help and quick reply.

 

Thanks

Barrett 

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