Drag Drop and open link

Design help Custom code
1

Hi, I try to recreate this drag and drop of the projects function.
https://www.aarongrieve.co.uk/work
https://preview.webflow.com/preview/aaron-grieve?preview=e6db47369ea2da343aaecbff00b4f374

Here is my attempt to recreate.

https://preview.webflow.com/preview/awesomeportfolio-e83d37?preview=3d44ea05fe25674eef5e2cb405f573f9

I´ve got the drag and drop working, but have no success with open the link by dropping the project.
Can somebody give me a hint how to implement a link to open my projects by dropping?
Tried it with the project “smart-thermostat”
This is how my custom code looks right now.

37
371196×884 63.6 KB

Thanks in advance!

Cheers twan

2

Paging @Aaron to see if he can help :slightly_smiling_face:

2 Likes
3

Hey @Twan I’ll take a look :slight_smile:

4

So each one of your “Droppable” “.project” items needs a “link element” in them, as the snippet shown above is looking for this snippet to open the corresponding page:

Use the HTML Embed element to place this snippet:
<a href="/your page address here" class="link-to-open"></a>

I think that’s all that is missing, as I can’t publish to test :smiley:

Let me know how you get on!

P.S. Thank @StuM for tagging me

1 Like
5

Thanks @StuM !

Hey Aaron, hope it´s fine to use your site as reference :slight_smile:
I did add the HTML Embed as told. But that wasn´t the problem.

Found out that I needed to add this too.

I thought this is just to delay the new opened site to give your animations time.

Thanks for your help!

1 Like
6

Hey glad you worked it out! And of course feel free, glad it inspired you :slight_smile: