how to change zIndex .dragndrop question

Question

first, have to look at this dragndrop (http://code.google.com/p/jquery-drag-and-drop/)

what i want to ask is , isit possible to add a ACTIVE "window" onClick???

example:

i got 3 window dragable, name drag1 , drag2 and drag3

drag1 zIndex="98"

drag2 zIndex="99"

drag3 zIndex="100"

when i click on the drag1, change the drag1 zIndex value to highest than all the other drag.

after that,

i click drag3, also change the drag3 zIndex value to highest than all the other drag.

also high than the drag1

example2:

set a ACTIVE drag onClick???

Answer 1

Okay, I think I see what you are going for. You should use the jqueryui method draggable. It has an option stack that automatically gives the dragged item the highest z-index.

example

<script type="text/javascript">
$(function() {
    $('.boxes').draggable({stack:{group: ".boxes", min:100}});
});
</script>
<style type="text/css">
#wrapper {
    height: 500px;
    width: 700px;
    background-color: #fffac0;
    border: 2px dashed #fffa0d;
}
    .boxes {
         width: 100px;
         height: 100px;
         border: 1px solid #bbb;
     }
     #box1 {
         background-color: red;
     }
     #box2 {
         background-color: green;
     }
     #box3 {
         background-color: blue;
     }
</style>

<div id="wrapper">
    <div id="box1" class="boxes"></div>
    <div id="box2" class="boxes"></div>
    <div id="box3" class="boxes"></div>
</div>