Hi everybody
I am all new to GreenSock animations - so please bare with me if the questions already have been answered. I have actually used quite a bit of time trying to find the answers myself
I primarily work with Joomla CMS, and InkScape for SVG's. I have made a few small animations with CSS, but would really like to take the webanimations further - so this is why I have started looking into GreenSock
In Joomla I keep hitting content-limits on making inline SVG's so I need some way to inject SVG's to the DOM and still be able to access paths, groups and so on for animations.
I know some javaScript, but my knowledge is somewhat limited - and JQuery doesn't really make much sense to me.
1. Can anyone help with best practice for injecting SVG's to the DOM? Am I doing this right?
I have made a pen where I have included one of my SVG's in <object>tags and some JS to access the script (I made the JS without JQuery dependency because I still have limited knowledge to get this working).
It works on my own homepage in all major browsers, but I am new to CodePen and can't really get it working over here?
(I tried visualizing in the HTML how I included the .js files on my homepage).
https://codepen.io/lars-ejaas/pen/qBWvqgy
2. Anyone with experience with exporting SVG's from inkscape for web?
I have tried Save As > Optimized SVG - but the layers tend to "jump around" a bit and making the SVG useless. Not sure what I am doing wrong? Inkscape's native SVG's work allright, but it would be nice to be able to limit the size on them somewhat...
Sorry for the long post - I hope some of you might be able to help a bit - thanks