Jump to content


  • Posts

  • Joined

  • Last visited

Acmafali's Achievements



  1. Yup that solved my issue! sorry for the late reply! Thank you for providing a plunker, my team managed to integrate gsap using this method.
  2. Hey guys, Thank you for helping me out before but i have realised that i actually need to access to the scope using the ng animate module but I cant actually create and access the global timeline object in my animation function, so I would need to create a directive which isn't a problem, i need this so I can rewind and resume the timeline with button clicks. I'm just wondering do you guys have any elegant solutions at hand to resolve this problem or do you see any issues making use of a directive so that we can access the scope timeline object. Thanks again for your help.
  3. Ah! excellent! That was the problem! I was just really confused on how to deal with triggering elements on page load, now it all makes sense now. Cheers dude!
  4. Hey guys, I'm having an issue with green sock at the moment, i'm having trouble integrating angular js 1.5 with GS. The animation isn't working at all, I'm not sure where I'm going wrong, maybe another pair of eyes can help resolve this. I've made a plunker which showing my issue: https://plnkr.co/9Qmqp6iz5HNvSIKkrHDB
  5. okay, so how do I actually create a mask for my svg? What shape should the mask be? I'm really new to the concept of a mask.
  6. Hi Guys, I'm currently creating an animation that requires me to animate an arrow which looks like its being drawn, the arrow itself has a zig-zag before the arrow head. The arrow SVG is in the codepen link below. So to explain in detail, I want the first circle at the bottom left to be filled left to right with the colour white and then the rectangle next to it and then to the next circle and so on, this colour goes all the way to the tip of the arrow head. I'm going to implement this on page with a black background and I'm planning to fill the arrow in white so it looks like its being drawn very quickly when animated with it being filled white. I have 2 versions of the arrow, one that is has a single path the other hasn't. Compound path: http://codepen.io/anon/pen/MymvpG Single Path: (Codepen URL attached to this post) I'm just really confused on how to approach this problem, do i use clipping path or a mask? Do I use Draw SVG?
  7. Hi, I would like to know how to play to specific points in the timeline with one button which will then pause once that point is reached until the play button is pressed again. Also I would like to know how to rewind to specific points in the timeline which will pause to that point until its pressed again. So i will only have 2 buttons in total which is rewind to previous check point and forward to next check point. I know this seems really obvious but the logic behind this is actually confusing me. Thanks.
  8. Yup! I got rid of all of the groups when in adobe illustrator, its all good now! Thanks guys!!
  9. Hi Diaco, I tried to include those tags into the MorphSVGPlugin.convertToPath() utility function but i still get the same problem, i excluded the <g> tag as well. Really confused
  10. Hi, I'm trying to morph one SVG to another, the SVG's are ontop of each other. Its an SVG of a brain that morphs into a thumbs up. I keep getting the error: WARNING: cannot morph a <G> SVG element. Use MorphSVGPlugin.convertToPath(elementOrSelectorText) to convert to a path before morphing. The brain has an id of #start. The thumbs up as an id of #end. The thumbs up is hidden in the css. I'm not sure where I'm going wrong, the codepen is attached.