Jump to content


  • Posts

  • Joined

  • Last visited

Posts posted by ryanroehl@gmail.com

  1. The reason that I want to use class is in regards to a unique scenario that I am in. I am a designer working with developers. I don't have a lot of coding experience so my developers gave me some guidelines to keep my code clean for the developers to have the easiest plug and play experience.


    So, we agreed for various reasons that it would be easier if I just simply avoided using ID. 


    If this is truly a unique scenario where I have to use IDs, I am sure thats fine. I just wanted to make sure that this would not become a reoccurring problem that I would keep running into.


    Thanks for the response, alwaysambitious. I couldn't find any examples either.


    And thanks for the tip, PointC. Thats basically the same answer I got from some of my developers. It seems that no one quite really understand why. But that indeed, specifically masks require the use of IDs.

    • Like 1
  2. This seems like such a simple question. But I spent the last 2 hours trying to figure this out to no avail. I even asked a coworker with some experience in SVG.


    Why can I not change the Mask call out from "ID" to "Class"? 


    In my example you can see that I simply copied the code from this original post (

    See the Pen KzmXYK by PointC (@PointC) on CodePen

    ), and pasted it using classes in stead of IDs, and it breaks the mask.


    What am I missing? This technically isn't a GreenSock question, but I am feeling a little desperate. 



    Thanks for any help!

    See the Pen EZyELE by ryanroehl (@ryanroehl) on CodePen

  3. Thanks for your help PointC!


    changing the order of the points does indeed work. And that code for reversing the timeline is perfect as well. 


    I was able to change the direction of the points for a different icon that I was working on, and that did indeed fix the problem. But when I bring the door into illustrator it wont let me reverse the path after making it into a compound path...

  4. I am using the morph function to tween from 4 SVG paths to 4 other SVG paths to mimic a vault door shutting.


    All the paths are morphing in the right way, except for one path. The #doorfront to #doorfront2 paths are morphing in the wrong direction. Can anyone give me a hand?





    bonus help points :P


    I need to have the mouse off to open the door back up. I can figure this one out though..... if someone could just help me with the door morphing issue that would be great!




    See the Pen qREbPo by ryanroehl (@ryanroehl) on CodePen