Setting z-index on draggable elements

jquery css jquery-ui draggable z-index
Zac picture Zac · Mar 7, 2011 · Viewed 58.5k times · Source

I am trying to set the z-index on draggable elements using jQuery. You can see what I am talking about and what I have so far here:

http://jsfiddle.net/sushik/LQ4JT/1/

It is very primitive and there are problems with it. Any ideas on how I would make the last clicked element have the highest z-index and rather than resetting all of the rest to a base z-index, have them step, so the 2nd to last clicked has the second highest z-index, etc..

Another problem I am having with it is that it only works on a full click event but the draggable functionality works by clicking and holding down. How could I have the class applied on that initial click down and not wait for the event of releasing the click?

Answer

Hussein picture Hussein · Mar 7, 2011

All you need to do is use draggable({stack: "div"}) Now when you drag a div it will automatically come to the top.

Check working example at http://jsfiddle.net/LQ4JT/8/

Related questions

How do I make a div width draggable?

I have a div nested inside another div which is used to display a settings console. The nested div has a fixed positioned inside the parent as follows: I'd like to add a draggable handle to the child div's left …

Read More
jQuery - CSS - Rotate Div by drag mouse event

I'm searching since a few day without real result, maybe someone can help me here. I've a div on my page (can containt an image, a text area, other), it's draggable and resizable (thanks to jQuery UI), and i want …

Read More
Slide right to left?

How can I have a div go from collapsed to expanded (and vice versa), but do so from right to left? Most everything I see out there is always left to right.

Read More