WoW Style inventory

[Ravinos]

For those that played WoW (most common MMO) or any other mmo for that matter I am trying to create a drag and drop style inventory system for my browser game. All of my items in the game are single images what when you mouse them over they pop up a description tool tip. However I do not know where to begin with making this system capable of click and drag.

Eventually this system would be used to drag items onto the paper doll to equip them or drag them to the trash can to delete them.

Has anyone had experience with a system like this?

[Jackolantern]

There are some drag'n'drop AJAX/Javascript tutorials online. Here is one that looked pretty nice. Of course there are just going to be for the dragging, and you would have to add the rest of the WoW-like functionality, as that is a bit too specialized to have much tutorial mention online.

[hallsofvallhalla]

javascript and ajax is the place to start for sure.

Off the top of my head I see a onclick event that mirrors the pic to the mouse position using style.left and style.top. Next a onclick event that drops the pic down and checks with a if statement checking the position and looping the squares position of the inventory to see which square it landed in and then snapping it into place.

Then a function call to ajax that updates the database for the inventory position and adding to inventory.

[Ravinos]

Thank you for pointing me in the right direction. I forgot there were so many libraries out there. Right now I'm trying to find a library that does everything I need in my game so I can keep everything consistent. So far jQuery and Scriptaculous are the two forerunners. If anyone has any library suggestions let me know.

An example of what I found that looks like a good starting point here. This is designed for lists I'll have to do a little looking into it to see how to make them draggable into separate <div>boxes.