Jump to content


Assign text to many rectangles using drag and drop and cloning the text

Recommended Posts

Hi! I don't know how to drag the text on the right and drop it above the rectangles. I have to repeat this operation therefore cloning the textis needed. I guess it is similar to this issue: 

Many thanks in andvance!

See the Pen eYKEvgz by max231 (@max231) on CodePen

Link to comment
Share on other sites

The problem is that when you're working with SVG, there's no such thing as z-index to make things appear on top of others. You have to literally append the element so that it's the last element in the children of the <svg>. In other words, it's completely dependent on the order in the DOM. 


You also had some faulty logic in your loop but I assume you wanted something like this: 

See the Pen NWzvMRV?editors=1010 by GreenSock (@GreenSock) on CodePen


I don't have time to dig into what you're trying to do with all those .children() calls inside your hitTest() - I'd bet that a ton of that could be greatly simplified but we just don't have the resources here to provide free general consulting services for logic issues. Same goes for your cloning stuff. We're happy to answer any GSAP-specific questions, though. 


Good luck!

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.