[Deferent Color for each path in MorphSVG]

Hi Mikel, thank you so much I really appreciate.

it work perfect  thanks again.

[Deferent Color for each path in MorphSVG]

Hi guys,

I'm trying to give a color for each path. my issues is the color of the first path is applied to all the rest!

thanks very much.

site to see the animation: www.mwmtest.com/bio

JS:

// Signs Anim //

var tlBio = new TimelineMax({ repeat: -1, delay: 3, repeatDelay: 0.2, yoyo: true }),

  earth = document.getElementById('earth');

 

tlBio.to(earth, 2, { morphSVG: '#fire' }, '+=1').to(earth, 2, { morphSVG: '#water' }, '+=1').to(earth, 2, { morphSVG: '#space' }, '+=1').to(earth, 2, { morphSVG: '#wind' }, '+=1');

CSS:

#earth {

  fill: pink !important;

}

#fire {

  fill: yellow !important;

  visibility: hidden;

}

#water {

  fill: blue !important;

  visibility: hidden;

}

#wind {

  fill: green !important;

  visibility: hidden;

}

#space {

  fill: red !important;

  visibility: hidden;

}

See the Pen by bio (@bio) on CodePen

[Using SplitText in Adobe Animate]

Hi guys, I found the same issue, and been stack init for 4 hours trying to find a solution! till i found your answer  Jonathan thanks I can stop looking and just use normal animation for my text ;(