Jump to content
Search Community

Image Stacked on top of drawSVG Possible?

benjino test
Moderator Tag

Warning: Please note

This thread was started before GSAP 3 was released. Some information, especially the syntax, may be out of date for GSAP 3. Please see the GSAP 3 migration guide and release notes for more information about how to update the code to GSAP 3's syntax. 

Recommended Posts

Sort of. I am not thinking that the photo (img) travels the path of the animation. I am thinking a photo on top of a animating svg, where the svg animates behind the photo with the svg being larger than the photo—the photo remains static on top of the animating svg.

Link to comment
Share on other sites

Hi Benjino,


But this is certainly possible. With position absolute, both can be superimposed.

Whre is the problem??


The best thing would be to provide a reduced CodePen:  with an image and the svg plus the scheduled animation.


And than happy tweening ...





  • Like 1
Link to comment
Share on other sites

Does the top photo have some transparency so the SVG animation behind it is visible? In any case, you should be able to absolutely position a photo over the top of the SVG. You could also put the image inside the SVG so it scales nicely with the animation.


Here's a really basic example of an image inside the SVG.


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


Happy tweening.


  • Like 5
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
  • Create New...