Jump to content

drag and drop


sugan
 Share

Recommended Posts

hiI've a page where i'm using the div's to render diff kind of info and i want to let the users arrange/place the div's wherever they want.For this i want to let them drag and drop elements using javascript..How can i do this? Can anyone of you render the sample code where i would move on.I want them to work in both IE and firefox.Regards,Sugan

Link to comment
Share on other sites

If you don't want to write it all yourself, you might look into using one of the many available libraries.jQuery - http://docs.jquery.com/UI/Draggablesmootools - http://demos.mootools.net/DragDropOtherwise, you might poke around this site to get some ideas:http://www.dynamicdrive.com/dynamicindex11/domdrag/index.htm

Link to comment
Share on other sites

If you want to work it out yourself, you will need an event handler for onmousedown that will record the element that was clicked on and enable dragging, like recording the start X and Y position of the click and the div. You'll need an onmousemove function that will change the position of the div by a certain amount depending on where the mouse cursor is now relative to where it started in the onmousedown function. Then you need an onmouseup function to disable dragging. If you want them to be able to resize the div also, then you will need some code that can check if they clicked near the edge of the div, and which edge.

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
 Share

×
×
  • Create New...