css and cycle not working together on staggerto

[ericshew]

Hi there,

 

I'm using cycle for the first time and am running into issues with using it and CSS together. I can make either one work fine separately but not together. My suspicion is that I am not using the correct syntax.

 

Basically, I'm wanting each menu item to be indented a specific amount so they are presented as an angle. here is the actual application of my code here:  Of course, there is the codepen above. 

 

https://www.3omsyoga.com/dev/

 

Would welcome your thoughts and assistance. Thank you in advance,. 

See the Pen NaOrdq by ericshew (@ericshew) on CodePen

[Sahil]

Ya you are using incorrect syntax. Cycle is part of regular properties. Here is introductory tutorial by GreenSock to get started quickly but going through docs will be good idea.

 

See the Pen OxBRmp by Sahil89 (@Sahil89) on CodePen

 

[PointC]

Hi @ericshew

 

Looks like @Sahil has answered your question, but I just wanted to add a note about the css: { } object. You can certainly write your tweens with that wrapper, but it's not necessary (& saves some typing). The engine (since version 1.8.0) will check if your target is a DOM element and automatically add that wrapper for you. 

 

Happy tween cycling.

[ericshew]

Awesome! Thanks for pointing that out!

[ericshew]

On 10/15/2017 at 1:12 AM, Sahil said:

Ya you are using incorrect syntax. Cycle is part of regular properties. Here is introductory tutorial by GreenSock to get started quickly but going through docs will be good idea.

Thanks very much, Sahil. I appreciate it! 

On 10/15/2017 at 1:12 AM, Sahil said:

 

See the Pen OxBRmp by Sahil89 (@Sahil89) on CodePen