Search the Community
Showing results for tags 'polygons'.
Found 4 results
-
Hi there, What I want is for the polygons that make up the top-right triangle and the bottom-left triangle to 'expand' when hovered. This is done via a TimelineMax modifying the polygons' points. I had this working using TweenLite to move everything when hovered over and then a bunch more TweenLites to move everything back, but because the actual situation I need this for is much more complicated, that became a huge pain really quickly. So I'm trying to convert as many things as possible to Timelines so I can just reverse them. The problem I'm experiencing here is: If you roll over one triangle, mouse-out of the SVG area, and then hover over the second triangle, it works as expected. However, if after page load you roll over one triangle, then immediately roll over the other, the first triangle will stay 'expanded'. I'm guessing the problem is something to do with the original triangle's points being overwritten somehow but I haven't been able to figure it out. I tried using TweenLite.set() but nothing changed. Thanks, EK -
Hello, I'm new to GSAP and exploring some animation with an svg low-poly image. I have a LOT of polygons in this image, and wonder if there is a fast way of getting all of the polygon fill colours and points? Am keen to make something like the exploding fox in the attached codepen, BUT don't want to have to manually type in each polygon info. Thanks!
-
I've got a complicated background image that I want to move subtly. I was thinking I could morph it back and forth between a few different versions, with the same number of polygons, but slightly different points/colors. As far as I can tell (I'm new to GSAP) morphsvg will only take one svg element and morph it into another, but doesn't morph one full svg into another. Maybe I can loop through an array of polygons in the svg to morph, but I think that would take forever and really bog down the site. I don't have to use morphsvg of course, but I can't think of anything else really that would give me a nice slightly shifting effect.
-
Is there any way of manipulating polygon shapes in GSAP without the use of webkit? I know that the clip can manipulate a border radius, but can it be used to create polygon shapes? I know that you can manipulate a SVG in a similar way, but then if I did that I don't think I'd be able to have a photograph inside the shape. Anyone got any ideas?
