Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

HTML

Javi Pérez
Javi Pérez
7,642 Points
Posted by Javi Pérez
Javi Pérez
7,642 Points

Is there any Drag & Drop course?

I'm doing the Web Design Course but I am interested on learning about Drag & Drop a little bit...

Is there any course of that? I don't know how I can search it...

Thanks!

2 Answers

Matt West
Matt West
14,545 Points
Matt West
Matt West
14,545 Points

Hi Javi,

I'm not sure if this is covered in a course yet (a quick search didn't bring up anything).

However, I wrote a tutorial covering native Drag and Drop over on the Treehouse blog a while back. Here's the link:

Tutorial: http://blog.teamtreehouse.com/implementing-native-drag-and-drop
Demo: http://demos.mattwest.io/drag-and-drop/

Hope this helps!
Let me know if you get stuck with anything :)

Javi Pérez
Javi Pérez
7,642 Points
Javi Pérez
Javi Pérez
7,642 Points

Thanks, I need more diffucult drag and drop that I can edit each box and move them to their places... Like this http://www.symbaloo.com/

But it's just a little difficult to me and I don't know how to create the edit box and the fix places to each draggable element.

Matt West
Matt West
14,545 Points
Matt West
Matt West
14,545 Points

Hi Javi,

To fix the boxes to certain positions you would need to set a drop target for each of the places you want boxes to land.
Then you need to monitor the drops to see which drop target a box lands in and run an animation to move the box so that it fits perfectly within the drop target.

That's essentially what is happening on http://www.symbaloo.com/

It's quite a complex UI to build. Running through some of the JavaScript courses should help.

Taking jQuery Basics and then Build an Interactive Website would be a good place to start.

Javi Pérez
Javi Pérez
7,642 Points
Javi Pérez
Javi Pérez
7,642 Points

Okey, so thanks far all! First I'll end Web design course and then I'll try to start JavaScript or jQuery Basics:)