Forum Discussion
Change an Illustrator SVG inside Storyline with GSAP
Luckily the change to target the inner SVGs from an imported Illustrator SVG are easy.
https://360.articulate.com/review/content/8d933ab6-3f92-4111-ab30-87d01d879956/review
As it selected only the upper 'bodyColor' element, to target all the paths inside it... is just a case of checking the HTML setup and adding needed code.
With these lines of code you now can select any part of a SVG and change the color of it. And in fact any attribute of the SVG, but showing that later. Keep in mind however that grouping and naming your elements in Illustrator is imminent, else its tough to select.
selectAllSVGelements("bodyColor");
function selectAllSVGelements(partialID){
var svgCollection = document.querySelectorAll("[id*='"+partialID+"'] > path:nth-child(n)");
for(var i = 0; i < svgCollection.length;i++){
gsap.to(svgCollection[i], {duration:2, strokeWidth:8, stroke: "#984807" ,fill:"#77F27B"});
}
}
Added the Story.