Question

I am working on a web based drag and drop type application.I could drag and drop the draggable element(i.e image) to required area (i.e droppable ‘div’ element).My problem is the droppable element is getting above the image element while dragging.I would also like to move the image further to other droppable element(there will be several droppable elements in my page) so i want my image,which is being dragged currently,to be on top of all other elements on the page.I used jQuery and html.Can any one please suggest me a way to solve this problem.Thanks in advance

Answer 1

You need to make sure the z-index of the image is set to a value higher than the other elements on the page. This can be done through CSS statically or with jQuery dynamically.

CSS:

img { z-index: 99999; }

jQuery:

$('img').css('zIndex', 99999);