Repeat whole SVG as pattern

[sherry]

Hi,

I have a SVG I have created. You can see it by following the link to the codpen url. I want to create an animation to repeat the DNA pattern indefinitely at 45 degrees while keeping it inside the circle.

 

I go no clue where to start :D

See the Pen zYGVRxO by sherryLooper (@sherryLooper) on CodePen.

[PointC]

Welcome to the forum.

 

I'm not sure what you're asking here. I don't see any animation in your demo. We're happy to help with any GSAP specific questions. Could you elaborate a bit about what you're trying to do? Thanks.

[sherry]

Hi,

I want to animate the helix structure in the circle by possibly making its duplicates so that they are concatenated with each other at their ends and this pattern will repeat itself indefinitely, so that it gives the illusion of one single strand moving forward at 45 degree angle.

I hope that it makes sense to you now.  Fingers crossed. 

[PointC]

There are a whole bunch of DNA demos on CodePen that should give you some ideas.

See the Pen by search (@search) on CodePen.

 

If you have specific GSAP related problems or questions as you progress with your project, we're happy to help.

 

[Shrug ¯\_(ツ)_/¯]

@chrisgannon did a nice one (as you describe inside a circle).

 

See the Pen xqwgPq by chrisgannon (@chrisgannon) on CodePen.

[sherry]

Thanks. This is gonna help a lot